From 169ecf57738e431ce30a20e5b10a94a4625dadba Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Maxi=20Quo=C3=9F?= <maxi@quoss.org>
Date: Thu, 30 Jan 2025 18:52:50 +0100
Subject: [PATCH] fix: update components to comply with daiysUI v5

---
 frontend/src/lib/components/DeviceCard.svelte |   2 +-
 .../src/lib/components/DeviceCardNic.svelte   |  10 +-
 frontend/src/lib/components/DeviceForm.svelte | 534 ++++++-----
 .../src/lib/components/DeviceFormPort.svelte  |  65 +-
 .../src/lib/components/NetworkScan.svelte     |  20 +-
 frontend/src/lib/i18n/de/index.ts             |   1 -
 frontend/src/lib/i18n/en/index.ts             |   1 -
 frontend/src/lib/i18n/es/index.ts             |   1 -
 frontend/src/lib/i18n/fr/index.ts             |   1 -
 frontend/src/lib/i18n/i18n-svelte.ts          |   1 +
 frontend/src/lib/i18n/i18n-types.ts           | 828 +++++++++---------
 frontend/src/lib/i18n/i18n-util.async.ts      |   1 +
 frontend/src/lib/i18n/i18n-util.sync.ts       |   1 +
 frontend/src/lib/i18n/i18n-util.ts            |   1 +
 frontend/src/lib/i18n/it/index.ts             |   1 -
 frontend/src/lib/i18n/ja/index.ts             |   1 -
 frontend/src/lib/i18n/nl/index.ts             |   1 -
 frontend/src/lib/i18n/pt/index.ts             |   1 -
 frontend/src/lib/i18n/zh-TW/index.ts          |   1 -
 frontend/src/lib/i18n/zh/index.ts             |   1 -
 frontend/src/routes/account/+page.svelte      |  18 +-
 frontend/src/routes/device/new/+page.svelte   |   4 +-
 frontend/src/routes/login/+page.svelte        |  16 +-
 frontend/src/routes/settings/+page.svelte     |  16 +-
 frontend/src/routes/users/+page.svelte        |  34 +-
 frontend/src/routes/welcome/+page.svelte      |  22 +-
 26 files changed, 763 insertions(+), 820 deletions(-)

diff --git a/frontend/src/lib/components/DeviceCard.svelte b/frontend/src/lib/components/DeviceCard.svelte
index 296a59d7..c6071d65 100644
--- a/frontend/src/lib/components/DeviceCard.svelte
+++ b/frontend/src/lib/components/DeviceCard.svelte
@@ -236,7 +236,7 @@
 		</h3>
 		<p class="py-4">{$LL.device.modal_confirm_shutdown_desc({ device: device.name })}</p>
 		<div class="modal-action">
-			<form method="dialog" class="flex flex-row flex-wrap gap-2">
+			<form method="dialog">
 				<button class="btn">{$LL.buttons.cancel()}</button>
 				<button class="btn btn-success" on:click={reboot}>{$LL.buttons.confirm()}</button>
 			</form>
diff --git a/frontend/src/lib/components/DeviceCardNic.svelte b/frontend/src/lib/components/DeviceCardNic.svelte
index 5cfc863f..dd034d77 100644
--- a/frontend/src/lib/components/DeviceCardNic.svelte
+++ b/frontend/src/lib/components/DeviceCardNic.svelte
@@ -157,13 +157,13 @@
 			</span>
 		</button>
 	{:else}
-		<button class="btn btn-warning btn-circle size-12" aria-label="Unknown">
+		<div class="btn btn-warning btn-circle size-12">
 			<span class="loading loading-ring loading-sm"></span>
-		</button>
+		</div>
 	{/if}
 	<div class="grow">
 		<div class="text-lg leading-4 font-bold">{device.ip}</div>
-		<div class="">{device.mac}</div>
+		<div>{device.mac}</div>
 		<div class="flex flex-wrap gap-x-4">
 			{#if device?.expand?.ports}
 				{#each device?.expand?.ports.sort((a, b) => a.number - b.number) as port}
@@ -203,7 +203,7 @@
 		</h3>
 		<p class="py-4">{$LL.device.modal_confirm_wake_desc({ device: device.name })}</p>
 		<div class="modal-action">
-			<form method="dialog" class="flex flex-row flex-wrap gap-2">
+			<form method="dialog">
 				<button class="btn">{$LL.buttons.cancel()}</button>
 				<button class="btn btn-success" on:click={wake}>{$LL.buttons.confirm()}</button>
 			</form>
@@ -218,7 +218,7 @@
 		</h3>
 		<p class="py-4">{$LL.device.modal_confirm_shutdown_desc({ device: device.name })}</p>
 		<div class="modal-action">
-			<form method="dialog" class="flex flex-row flex-wrap gap-2">
+			<form method="dialog">
 				<button class="btn">{$LL.buttons.cancel()}</button>
 				<button class="btn btn-success" on:click={shutdown}>{$LL.buttons.confirm()}</button>
 			</form>
diff --git a/frontend/src/lib/components/DeviceForm.svelte b/frontend/src/lib/components/DeviceForm.svelte
index 812c1fd5..0abfa26d 100644
--- a/frontend/src/lib/components/DeviceForm.svelte
+++ b/frontend/src/lib/components/DeviceForm.svelte
@@ -182,85 +182,65 @@
 		<div class="card-body">
 			<h2 class="card-title">{$LL.device.general()}</h2>
 			<div class="grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-4">
-				<div class="w-full max-w-xs">
-					<label class="label" for="device-name">
-						<div class="label-text">
-							<span>{$LL.device.general_name()}</span>
-							<span class="text-error">*</span>
-						</div>
+				<fieldset class="fieldset">
+					<label class="floating-label">
+						<span>{$LL.device.general_name()} <span class="text-error">*</span></span>
+						<input
+							type="text"
+							placeholder={$LL.device.general_name()}
+							class="input"
+							bind:value={device.name}
+							required
+						/>
 					</label>
-					<input
-						id="device-name"
-						type="text"
-						placeholder={$LL.device.general_name_placeholder()}
-						class="input w-full max-w-xs"
-						bind:value={device.name}
-						required
-					/>
-				</div>
-				<div class="w-full max-w-xs">
-					<label class="label" for="device-ip">
-						<div class="label-text">
-							<span>{$LL.device.general_ip()}</span>
-							<span class="text-error">*</span>
-						</div>
+				</fieldset>
+				<fieldset class="fieldset">
+					<label class="floating-label">
+						<span>{$LL.device.general_ip()} <span class="text-error">*</span></span>
+						<input
+							type="text"
+							placeholder={$LL.device.general_ip()}
+							class="input"
+							bind:value={device.ip}
+							required
+						/>
 					</label>
-					<input
-						id="device-ip"
-						type="text"
-						placeholder="192.168.0.5"
-						class="input w-full max-w-xs"
-						bind:value={device.ip}
-						required
-					/>
-				</div>
-				<div class="w-full max-w-xs">
-					<label class="label" for="device-mac">
-						<div class="label-text">
-							<span>{$LL.device.general_mac()}</span>
-							<span class="text-error">*</span>
-						</div>
+				</fieldset>
+				<fieldset class="fieldset">
+					<label class="floating-label">
+						<span>{$LL.device.general_mac()} <span class="text-error">*</span></span>
+						<input
+							type="text"
+							placeholder={$LL.device.general_mac()}
+							class="input"
+							bind:value={device.mac}
+							required
+						/>
 					</label>
-					<input
-						id="device-mac"
-						type="text"
-						placeholder="aa:bb:cc:dd:ee:ff"
-						class="input w-full max-w-xs"
-						bind:value={device.mac}
-						required
-					/>
-				</div>
-				<div class="w-full max-w-xs">
-					<label class="label" for="device-netmask">
-						<div class="label-text">
-							<span>{$LL.device.general_netmask()}</span>
-							<span class="text-error">*</span>
-						</div>
+				</fieldset>
+				<fieldset class="fieldset">
+					<label class="floating-label">
+						<span>{$LL.device.general_netmask()} <span class="text-error">*</span></span>
+						<input
+							type="text"
+							placeholder={$LL.device.general_netmask()}
+							class="input"
+							bind:value={device.netmask}
+							required
+						/>
 					</label>
-					<input
-						id="device-netmask"
-						type="text"
-						placeholder="255.255.255.0"
-						class="input w-full max-w-xs"
-						bind:value={device.netmask}
-						required
-					/>
-				</div>
-				<div class="w-full max-w-xs">
-					<label class="label" for="device-description">
-						<div class="label-text">
-							<span>{$LL.device.general_description()}</span>
-						</div>
+				</fieldset>
+				<fieldset class="fieldset">
+					<label class="floating-label">
+						<span>{$LL.device.general_description()}</span>
+						<input
+							type="text"
+							placeholder={$LL.device.general_description()}
+							class="input"
+							bind:value={device.description}
+						/>
 					</label>
-					<input
-						id="device-description"
-						type="text"
-						placeholder={$LL.device.general_description_placeholder()}
-						class="input w-full max-w-xs"
-						bind:value={device.description}
-					/>
-				</div>
-
+				</fieldset>
 				<span class="badge text-error self-center">* {$LL.device.general_required_field()}</span>
 			</div>
 		</div>
@@ -291,32 +271,27 @@
 				{$LL.device.link_desc()}
 			</p>
 			<div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
-				<div class="w-full max-w-xs">
-					<label class="label" for="device-link">
-						<div class="label-text">{$LL.device.link()}</div>
+				<fieldset class="fieldset">
+					<label class="floating-label">
+						<span>{$LL.device.link()}</span>
+						<input
+							type="url"
+							placeholder={$LL.device.link()}
+							class="input"
+							bind:value={device.link}
+						/>
 					</label>
-					<input
-						id="device-link"
-						type="url"
-						placeholder="https:// ..."
-						class="input w-full max-w-xs"
-						bind:value={device.link}
-					/>
-				</div>
-				<div class="w-full max-w-xs">
-					<label class="label" for="device-link-open">
-						<div class="label-text">{$LL.device.link_open()}</div>
+				</fieldset>
+				<fieldset class="fieldset">
+					<label class="floating-label">
+						<span>{$LL.device.link_open()}</span>
+						<select class="select" bind:value={device.link_open}>
+							<option value="">{$LL.device.link_open_no()}</option>
+							<option value="same_tab">{$LL.device.link_open_same_tab()}</option>
+							<option value="new_tab">{$LL.device.link_open_new_tab()}</option>
+						</select>
 					</label>
-					<select
-						id="device-link-open"
-						class="select select-bordered"
-						bind:value={device.link_open}
-					>
-						<option value="">{$LL.device.link_open_no()}</option>
-						<option value="same_tab">{$LL.device.link_open_same_tab()}</option>
-						<option value="new_tab">{$LL.device.link_open_new_tab()}</option>
-					</select>
-				</div>
+				</fieldset>
 			</div>
 		</div>
 	</div>
@@ -327,18 +302,17 @@
 				<!-- eslint-disable svelte/no-at-html-tags -->
 				{@html $LL.device.ping_desc()}
 			</p>
-			<div class="w-full max-w-xs">
-				<label class="label cursor-pointer" for="ping-cmd">
-					<span class="label-text">{$LL.device.ping_cmd()}</span>
+			<fieldset class="fieldset">
+				<label class="floating-label">
+					<span>{$LL.device.ping_cmd()}</span>
+					<input
+						type="text"
+						placeholder={$LL.device.ping_cmd()}
+						class="input"
+						bind:value={device.ping_cmd}
+					/>
 				</label>
-				<input
-					id="ping-cmd"
-					type="text"
-					placeholder="$:"
-					class="input mb-2 w-full max-w-xs"
-					bind:value={device.ping_cmd}
-				/>
-			</div>
+			</fieldset>
 		</div>
 	</div>
 	<div class="card bg-base-200 mt-6 w-full shadow-sm">
@@ -349,60 +323,56 @@
 				<!-- eslint-disable svelte/no-at-html-tags -->
 				{@html $LL.settings.ping_interval_desc2()}
 			</p>
-			<div class="w-full max-w-xs">
-				<label class="label cursor-pointer" for="wake-cmd">
-					<span class="label-text">{$LL.device.wake_cmd()}</span>
-				</label>
-				<input
-					id="wake-cmd"
-					type="text"
-					placeholder="$:"
-					class="input mb-2 w-full max-w-xs"
-					bind:value={device.wake_cmd}
-				/>
-			</div>
-			<div class="flex flex-col">
-				<label class="label cursor-pointer" for="wake-confirm">
-					<span class="label-text">{$LL.device.require_confirmation()}</span>
-				</label>
-				<input
-					id="wake-confirm"
-					type="checkbox"
-					class="toggle toggle-success"
-					bind:checked={device.wake_confirm}
-				/>
-			</div>
-			<div class="flex flex-row flex-wrap gap-4">
-				<div class="flex flex-col">
-					<label class="label cursor-pointer" for="wake-cron-enable">
-						<span class="label-text">{$LL.device.wake_cron_enable()}</span>
-					</label>
+			<fieldset class="fieldset">
+				<label class="floating-label">
+					<span>{$LL.device.wake_cmd()}</span>
 					<input
-						id="wake-cron-enable"
-						type="checkbox"
-						class="toggle toggle-success"
-						bind:checked={device.wake_cron_enabled}
+						type="text"
+						placeholder={$LL.device.wake_cmd()}
+						class="input"
+						bind:value={device.wake_cmd}
 					/>
-				</div>
-				<div class="w-full max-w-xs">
-					<label class="label" for="wake-cron">
-						<span class="label-text"
-							>{$LL.device.shutdown_cron()}
+				</label>
+			</fieldset>
+			<div class="flex flex-row flex-wrap gap-4">
+				<fieldset class="fieldset bg-base-100 border-base-300 rounded-box w-64 border p-4">
+					<legend class="fieldset-legend">{$LL.device.wake_cron_enable()}</legend>
+					<label class="fieldset-label">
+						<input
+							type="checkbox"
+							bind:checked={device.wake_cron_enabled}
+							class="toggle toggle-success"
+						/>
+						{$LL.device.wake_cron_enable()}
+					</label>
+					<label class="floating-label mt-4">
+						<span
+							>{$LL.device.wake_cron()}
 							{#if device.wake_cron_enabled}
 								<span class="text-error">*</span>
 							{/if}
 						</span>
+						<input
+							type="text"
+							placeholder={$LL.device.wake_cron()}
+							class="input"
+							bind:value={device.wake_cron}
+							disabled={!device.wake_cron_enabled}
+							required={device.wake_cron_enabled}
+						/>
 					</label>
-					<input
-						id="wake-cron"
-						type="text"
-						placeholder="M H DoM M DoW"
-						class="input w-full max-w-xs"
-						bind:value={device.wake_cron}
-						disabled={!device.wake_cron_enabled}
-						required={device.wake_cron_enabled}
-					/>
-				</div>
+				</fieldset>
+				<fieldset class="fieldset bg-base-100 border-base-300 rounded-box w-64 border p-4">
+					<legend class="fieldset-legend">{$LL.device.require_confirmation()}</legend>
+					<label class="fieldset-label">
+						<input
+							type="checkbox"
+							bind:checked={device.wake_confirm}
+							class="toggle toggle-success"
+						/>
+						{$LL.device.require_confirmation()}
+					</label>
+				</fieldset>
 			</div>
 		</div>
 	</div>
@@ -421,93 +391,78 @@
 				<!-- eslint-disable svelte/no-at-html-tags -->
 				{@html $LL.device.sol_desc3()}
 			</p>
-
 			<div class="flex flex-row flex-wrap gap-4">
-				<div class="flex flex-col">
-					<label class="label cursor-pointer" for="sol-enable">
-						<span class="label-text">{$LL.device.sol_enable()}</span>
+				<fieldset class="fieldset bg-base-100 border-base-300 rounded-box w-64 border p-4">
+					<legend class="fieldset-legend">{$LL.device.sol_enable()}</legend>
+					<label class="fieldset-label">
+						<input
+							type="checkbox"
+							bind:checked={device.sol_enabled}
+							class="toggle toggle-success"
+						/>
+						{$LL.device.sol_enable()}
 					</label>
-					<input
-						id="sol-enable"
-						type="checkbox"
-						class="toggle toggle-success"
-						bind:checked={device.sol_enabled}
-					/>
-				</div>
-				<div class="flex flex-col">
-					<label class="label" for="sol-port">
-						<span class="label-text"
+					<label class="floating-label mt-4">
+						<span
 							>{$LL.device.sol_port()}
 							{#if device.sol_enabled}
 								<span class="text-error">*</span>
 							{/if}
 						</span>
-					</label>
-					<input
-						id="sol-port"
-						type="number"
-						min="1"
-						max="65535"
-						class="input"
-						bind:value={device.sol_port}
-						disabled={!device.sol_enabled}
-						required={device.sol_enabled}
-					/>
-				</div>
-			</div>
-			{#if device.sol_enabled}
-				<div class="flex flex-row flex-wrap gap-4">
-					<div class="flex flex-col">
-						<label class="label cursor-pointer" for="sol-auth">
-							<span class="label-text">{$LL.device.sol_authorization()}</span>
-						</label>
 						<input
-							id="sol-auth"
-							type="checkbox"
-							class="toggle toggle-success"
-							bind:checked={device.sol_auth}
+							class="input"
+							type="number"
+							min="1"
+							max="65535"
+							placeholder={$LL.device.sol_port()}
+							bind:value={device.sol_port}
+							disabled={!device.sol_enabled}
+							required={device.sol_enabled}
 						/>
-					</div>
-					<div class="flex flex-col">
-						<label class="label" for="sol-user">
-							<span class="label-text"
+					</label>
+				</fieldset>
+				{#if device.sol_enabled}
+					<fieldset class="fieldset bg-base-100 border-base-300 rounded-box w-64 border p-4">
+						<legend class="fieldset-legend">{$LL.device.sol_authorization()}</legend>
+						<label class="fieldset-label">
+							<input type="checkbox" bind:checked={device.sol_auth} class="toggle toggle-success" />
+							{$LL.device.sol_authorization()}
+						</label>
+						<label class="floating-label mt-4">
+							<span
 								>{$LL.device.sol_user()}
 								{#if device.sol_auth}
 									<span class="text-error">*</span>
 								{/if}
 							</span>
+							<input
+								type="text"
+								placeholder={$LL.device.sol_user()}
+								class="input"
+								bind:value={device.sol_user}
+								disabled={!device.sol_auth}
+								required={device.sol_auth}
+							/>
 						</label>
-						<input
-							id="sol-user"
-							type="text"
-							placeholder={$LL.device.sol_user()}
-							class="input"
-							bind:value={device.sol_user}
-							disabled={!device.sol_auth}
-							required={device.sol_auth}
-						/>
-					</div>
-					<div class="flex flex-col">
-						<label class="label" for="sol-password">
-							<span class="label-text"
+						<label class="floating-label">
+							<span
 								>{$LL.device.sol_password()}
 								{#if device.sol_auth}
 									<span class="text-error">*</span>
 								{/if}
 							</span>
+							<input
+								type="password"
+								placeholder={$LL.device.sol_password()}
+								class="input"
+								bind:value={device.sol_passwort}
+								disabled={!device.sol_auth}
+								required={device.sol_auth}
+							/>
 						</label>
-						<input
-							id="sol-password"
-							type="password"
-							placeholder={$LL.device.sol_password()}
-							class="input"
-							bind:value={device.sol_password}
-							disabled={!device.sol_auth}
-							required={device.sol_auth}
-						/>
-					</div>
-				</div>
-			{/if}
+					</fieldset>
+				{/if}
+			</div>
 		</div>
 	</div>
 
@@ -518,81 +473,78 @@
 				<!-- eslint-disable svelte/no-at-html-tags -->
 				{@html $LL.device.shutdown_desc()}
 			</p>
+			<fieldset class="fieldset">
+				<label class="floating-label">
+					<span>{$LL.device.shutdown_cmd()}</span>
+					<input
+						type="text"
+						placeholder={$LL.device.shutdown_cmd()}
+						class="input"
+						bind:value={device.shutdown_cmd}
+					/>
+				</label>
+			</fieldset>
 			<p class="my-2 font-bold">{$LL.device.shutdown_examples()}</p>
 			<div class="mockup-code max-w-fit min-w-0 text-sm">
-				<pre data-prefix="#"><code>{$LL.device.shutdown_examples_windows()}</code></pre>
+				<pre data-prefix="#" class="italic"><code>{$LL.device.shutdown_examples_windows()}</code
+					></pre>
 				<pre data-prefix="$" class="text-warning"><code
 						>net rpc shutdown -I 192.168.1.13 -U "user%password"</code
 					></pre>
 			</div>
 			<div class="mockup-code max-w-fit min-w-0 text-sm">
-				<pre data-prefix="#"><code>{$LL.device.shutdown_examples_linux()}</code></pre>
+				<pre data-prefix="#" class="italic"><code>{$LL.device.shutdown_examples_linux()}</code
+					></pre>
 				<pre data-prefix="$" class="text-warning"><code
 						>sshpass -p password ssh -o "StrictHostKeyChecking=no" user@192.168.1.13 "sudo poweroff"</code
 					></pre>
 			</div>
-			<div class="w-full max-w-xs">
-				<label class="label cursor-pointer" for="shutdown-cmd">
-					<span class="label-text">{$LL.device.shutdown_cmd()}</span>
-				</label>
-				<input
-					id="shutdown-cmd"
-					type="text"
-					placeholder="$:"
-					class="input mb-2 w-full max-w-xs"
-					bind:value={device.shutdown_cmd}
-				/>
-			</div>
-			<div class="flex flex-row flex-wrap gap-4">
-				<div class="flex flex-col">
-					<label class="label cursor-pointer" for="shutdown-confirm">
-						<span class="label-text">{$LL.device.require_confirmation()}</span>
-					</label>
-					<input
-						id="shutdown-confirm"
-						type="checkbox"
-						class="toggle toggle-success"
-						bind:checked={device.shutdown_confirm}
-					/>
-				</div>
-			</div>
-			<p class="my-2">
+			<p class="mt-4">
 				{$LL.device.shutdown_cron_desc()}
 			</p>
 			<div class="flex flex-row flex-wrap gap-4">
-				<div class="flex flex-col">
-					<label class="label cursor-pointer" for="shutdown-cron-enable">
-						<span class="label-text">{$LL.device.shutdown_cron_enable()}</span>
+				<fieldset class="fieldset bg-base-100 border-base-300 rounded-box w-64 border p-4">
+					<legend class="fieldset-legend">{$LL.device.shutdown_cron_enable()}</legend>
+					<label class="fieldset-label">
+						<input
+							type="checkbox"
+							bind:checked={device.shutdown_cron_enabled}
+							class="toggle toggle-success"
+						/>
+						{$LL.device.shutdown_cron_enable()}
 					</label>
-					<input
-						id="shutdown-cron-enable"
-						type="checkbox"
-						class="toggle toggle-success"
-						bind:checked={device.shutdown_cron_enabled}
-					/>
-				</div>
-				<div class="w-full max-w-xs">
-					<label class="label" for="shutdown-cron">
-						<span class="label-text"
+					<label class="floating-label mt-4">
+						<span
 							>{$LL.device.shutdown_cron()}
 							{#if device.shutdown_cron_enabled}
 								<span class="text-error">*</span>
 							{/if}
 						</span>
+						<input
+							type="text"
+							placeholder={$LL.device.shutdown_cron()}
+							class="input"
+							bind:value={device.shutdown_cron}
+							disabled={!device.shutdown_cron_enabled}
+							required={device.shutdown_cron_enabled}
+						/>
 					</label>
-					<input
-						id="shutdown-cron"
-						type="text"
-						placeholder="M H DoM M DoW"
-						class="input w-full max-w-xs"
-						bind:value={device.shutdown_cron}
-						disabled={!device.shutdown_cron_enabled}
-						required={device.shutdown_cron_enabled}
-					/>
-				</div>
+				</fieldset>
+				<fieldset class="fieldset bg-base-100 border-base-300 rounded-box w-64 border p-4">
+					<legend class="fieldset-legend">{$LL.device.require_confirmation()}</legend>
+					<label class="fieldset-label">
+						<input
+							type="checkbox"
+							bind:checked={device.shutdown_confirm}
+							class="toggle toggle-success"
+						/>
+						{$LL.device.require_confirmation()}
+					</label>
+				</fieldset>
 			</div>
 		</div>
 	</div>
+
 	<div class="card bg-base-200 mt-6 w-full shadow-sm">
 		<div class="card-body">
 			<h2 class="card-title">{$LL.device.password()}</h2>
@@ -600,15 +552,18 @@
 				<!-- eslint-disable svelte/no-at-html-tags -->
 				{@html $LL.device.password_desc()}
 			</p>
-			<div class="w-full">
-				<input
-					type="password"
-					placeholder="123456"
-					class="input w-full max-w-xs"
-					maxlength="6"
-					bind:value={device.password}
-				/>
-			</div>
+			<fieldset class="fieldset">
+				<label class="floating-label">
+					<span>{$LL.device.password()}</span>
+					<input
+						type="text"
+						placeholder={$LL.device.password()}
+						class="input"
+						maxlength="6"
+						bind:value={device.password}
+					/>
+				</label>
+			</fieldset>
 		</div>
 	</div>
 	<div class="card bg-base-200 mt-6 w-full shadow-sm">
@@ -642,9 +597,9 @@
 					</div>
 				{/each}
 			</div>
-			<div class="join max-w-xs">
+			<div class="join">
 				<input
-					class="input join-item input-bordered w-full"
+					class="input join-item"
 					placeholder={$LL.device.groups_placeholder()}
 					type="text"
 					bind:value={newGroup}
@@ -665,12 +620,15 @@
 	</div>
 </form>
 <dialog class="modal" bind:this={deleteModal}>
-	<form method="dialog" class="modal-box">
+	<div class="modal-box">
 		<h3 class="text-lg font-bold">{$LL.users.confirm_delete_title()}</h3>
 		<p class="py-4">{$LL.users.confirm_delete_desc({ username: device.name })}</p>
 		<div class="modal-action">
-			<button class="btn">{$LL.buttons.cancel()}</button>
-			<button class="btn btn-error" on:click={() => deleteDevice()}>{$LL.buttons.delete()}</button>
+			<form method="dialog">
+				<button class="btn">{$LL.buttons.cancel()}</button>
+				<button class="btn btn-error" on:click={() => deleteDevice()}>{$LL.buttons.delete()}</button
+				>
+			</form>
 		</div>
-	</form>
+	</div>
 </dialog>
diff --git a/frontend/src/lib/components/DeviceFormPort.svelte b/frontend/src/lib/components/DeviceFormPort.svelte
index 2d366f9b..6088afc4 100644
--- a/frontend/src/lib/components/DeviceFormPort.svelte
+++ b/frontend/src/lib/components/DeviceFormPort.svelte
@@ -30,39 +30,44 @@
 	<fieldset class="fieldset bg-base-100 border-base-300 rounded-box w-xs border p-4">
 		<legend class="fieldset-legend"># {device.expand.ports.length}</legend>
 		<div class="flex flex-row gap-2">
-			<div>
-				<label class="fieldset-label" for="port-name-{index}">{$LL.device.ports_name()}</label>
+			<fieldset class="fieldset">
+				<label class="floating-label">
+					<span>{$LL.device.ports_name()} <span class="text-error">*</span></span>
+					<input
+						type="text"
+						placeholder={$LL.device.ports_name()}
+						class="input"
+						required
+						bind:value={device.expand.ports[index].name}
+					/>
+				</label>
+			</fieldset>
+			<fieldset class="fieldset">
+				<label class="floating-label">
+					<span>{$LL.device.ports_number()} <span class="text-error">*</span></span>
+					<input
+						type="number"
+						placeholder={$LL.device.ports_number()}
+						class="input"
+						min="1"
+						max="65535"
+						required
+						bind:value={device.expand.ports[index].number}
+					/>
+				</label>
+			</fieldset>
+		</div>
+		<fieldset class="fieldset">
+			<label class="floating-label">
+				<span>{$LL.device.link()}</span>
 				<input
-					id="port-name-{index}"
 					type="text"
-					class="input input-sm"
-					placeholder="ssh"
-					bind:value={device.expand.ports[index].name}
+					placeholder={$LL.device.link()}
+					class="input"
+					bind:value={device.expand.ports[index].link}
 				/>
-			</div>
-			<div>
-				<label class="fieldset-label" for="port-number-{index}">{$LL.device.ports_number()}</label>
-				<input
-					type="number"
-					class="input input-sm"
-					min="1"
-					max="65535"
-					placeholder="22"
-					required
-					bind:value={device.expand.ports[index].number}
-				/>
-			</div>
-		</div>
-		<div>
-			<label class="fieldset-label" for="port-link-{index}">{$LL.device.link()}</label>
-			<input
-				id="port-link-{index}"
-				type="url"
-				class="input input-sm"
-				placeholder="https:// ..."
-				bind:value={device.expand.ports[index].link}
-			/>
-		</div>
+			</label>
+		</fieldset>
 		<button
 			class="btn btn-error btn-xs btn-soft ms-auto"
 			on:click={() => deletePort(device.expand.ports[index])}
diff --git a/frontend/src/lib/components/NetworkScan.svelte b/frontend/src/lib/components/NetworkScan.svelte
index 975fe3e2..849eef1d 100644
--- a/frontend/src/lib/components/NetworkScan.svelte
+++ b/frontend/src/lib/components/NetworkScan.svelte
@@ -126,12 +126,12 @@
 			<div class="flex flex-row flex-wrap items-end gap-4">
 				<form on:submit|preventDefault={saveSettings}>
 					<label class="label" for="scan-range">
-						<span class="label-text">{$LL.device.network_scan_ip_range()}</span>
+						<span>{$LL.device.network_scan_ip_range()}</span>
 					</label>
 					<div class="join max-w-xs">
 						<input
 							id="scan-range"
-							class="input join-item input-bordered w-full"
+							class="input join-item w-full"
 							type="text"
 							placeholder="192.168.1.0/24"
 							bind:value={scanRange}
@@ -205,22 +205,22 @@
 					</div>
 				{/each}
 				<h2 class="card-title mt-4">{$LL.device.network_scan_add_all()}</h2>
-				<div class="form-control max-w-fit">
+				<div class="max-w-fit">
 					<label class="label cursor-pointer">
 						<input type="checkbox" class="checkbox" bind:checked={replaceNetmaskCheckbox} />
-						<span class="label-text ms-2 text-wrap break-words"
+						<span class="ms-2 text-wrap break-words"
 							>{$LL.device.network_scan_replace_netmask()}</span
 						>
 					</label>
 				</div>
 				{#if replaceNetmaskCheckbox}
-					<div class="form-control max-w-fit">
+					<div class="max-w-fit">
 						<label class="label cursor-pointer" for="replaceNetmaskInput">
-							<span class="label-text ms-2">{$LL.device.network_scan_new_netmask()}</span>
+							<span class="ms-2">{$LL.device.network_scan_new_netmask()}</span>
 						</label>
 						<input
 							id="replaceNetmaskInput"
-							class="input input-bordered"
+							class="input"
 							type="text"
 							placeholder="255.255.255.0"
 							bind:value={replaceNetmask}
@@ -228,10 +228,10 @@
 					</div>
 				{/if}
 				{#if scanResponse.devices.find((dev) => dev.name === 'Unknown')}
-					<div class="form-control max-w-fit">
+					<div class="max-w-fit">
 						<label class="label cursor-pointer">
 							<input type="checkbox" class="checkbox" bind:checked={addAllCheckbox} />
-							<span class="label-text ms-2 text-wrap break-words"
+							<span class="ms-2 text-wrap break-words"
 								>{$LL.device.network_scan_include_unknown()}</span
 							>
 						</label>
@@ -258,7 +258,7 @@
 						{/if}
 					</div>
 				{:else}
-					<div class="form-control max-w-fit">
+					<div class="max-w-fit">
 						<button
 							class="btn btn-success"
 							on:click={() => addAll()}
diff --git a/frontend/src/lib/i18n/de/index.ts b/frontend/src/lib/i18n/de/index.ts
index 24911169..e59099b1 100644
--- a/frontend/src/lib/i18n/de/index.ts
+++ b/frontend/src/lib/i18n/de/index.ts
@@ -51,7 +51,6 @@ const de = {
 		modal_confirm_shutdown_desc: 'Bitte bestätigen, um {device} herunterzufahren.',
 		general: 'Allgemein',
 		general_name: 'Name',
-		general_name_placeholder: 'Gerätename',
 		general_ip: 'IP',
 		general_mac: 'Mac',
 		general_netmask: 'Netmask',
diff --git a/frontend/src/lib/i18n/en/index.ts b/frontend/src/lib/i18n/en/index.ts
index 276a8ad6..e2de48a2 100644
--- a/frontend/src/lib/i18n/en/index.ts
+++ b/frontend/src/lib/i18n/en/index.ts
@@ -49,7 +49,6 @@ const en = {
 		modal_confirm_shutdown_desc: 'Please confirm to shutdown {device}.',
 		general: 'General',
 		general_name: 'Name',
-		general_name_placeholder: 'Device name',
 		general_ip: 'IP',
 		general_mac: 'Mac',
 		general_netmask: 'Netmask',
diff --git a/frontend/src/lib/i18n/es/index.ts b/frontend/src/lib/i18n/es/index.ts
index edb59a28..56023085 100644
--- a/frontend/src/lib/i18n/es/index.ts
+++ b/frontend/src/lib/i18n/es/index.ts
@@ -51,7 +51,6 @@ const es = {
 		modal_confirm_shutdown_desc: 'Por favor confirme para apagar {device}.',
 		general: 'General',
 		general_name: 'Nombre',
-		general_name_placeholder: 'Nombre del dispositivo',
 		general_ip: 'IP',
 		general_mac: 'Mac',
 		general_netmask: 'Máscara de red',
diff --git a/frontend/src/lib/i18n/fr/index.ts b/frontend/src/lib/i18n/fr/index.ts
index 55cfbd93..49df9870 100644
--- a/frontend/src/lib/i18n/fr/index.ts
+++ b/frontend/src/lib/i18n/fr/index.ts
@@ -52,7 +52,6 @@ const fr = {
 		modal_confirm_shutdown_desc: "Veuillez confirmer l'arrêt du {device}.",
 		general: 'Général',
 		general_name: 'Nom',
-		general_name_placeholder: "Nom de l'appareil",
 		general_ip: 'IP',
 		general_mac: 'Mac',
 		general_netmask: 'Masque réseau',
diff --git a/frontend/src/lib/i18n/i18n-svelte.ts b/frontend/src/lib/i18n/i18n-svelte.ts
index f2c13c4a..ca6733e4 100644
--- a/frontend/src/lib/i18n/i18n-svelte.ts
+++ b/frontend/src/lib/i18n/i18n-svelte.ts
@@ -1,4 +1,5 @@
 // This file was auto-generated by 'typesafe-i18n'. Any manual changes will be overwritten.
+ 
 
 import { initI18nSvelte } from 'typesafe-i18n/svelte';
 import type { Formatters, Locales, TranslationFunctions, Translations } from './i18n-types';
diff --git a/frontend/src/lib/i18n/i18n-types.ts b/frontend/src/lib/i18n/i18n-types.ts
index 924d7d88..93fef3e8 100644
--- a/frontend/src/lib/i18n/i18n-types.ts
+++ b/frontend/src/lib/i18n/i18n-types.ts
@@ -1,9 +1,13 @@
 // This file was auto-generated by 'typesafe-i18n'. Any manual changes will be overwritten.
 /* eslint-disable */
-import type { BaseTranslation as BaseTranslationType, LocalizedString, RequiredParams } from 'typesafe-i18n'
+import type {
+	BaseTranslation as BaseTranslationType,
+	LocalizedString,
+	RequiredParams
+} from 'typesafe-i18n';
 
-export type BaseTranslation = BaseTranslationType
-export type BaseLocale = 'en'
+export type BaseTranslation = BaseTranslationType;
+export type BaseLocale = 'en';
 
 export type Locales =
 	| 'de'
@@ -24,1592 +28,1584 @@ export type Locales =
 	| 'pt-PT'
 	| 'zh'
 	| 'zh-CN'
-	| 'zh-TW'
+	| 'zh-TW';
 
-export type Translation = RootTranslation
+export type Translation = RootTranslation;
 
-export type Translations = RootTranslation
+export type Translations = RootTranslation;
 
 type RootTranslation = {
 	home: {
 		/**
 		 * H​o​m​e
 		 */
-		page_title: string
+		page_title: string;
 		/**
 		 * G​r​o​u​p​s
 		 */
-		order_groups: string
+		order_groups: string;
 		/**
 		 * N​a​m​e
 		 */
-		order_name: string
+		order_name: string;
 		/**
 		 * I​P
 		 */
-		order_ip: string
+		order_ip: string;
 		/**
 		 * O​r​d​e​r
 		 */
-		order_tooltip: string
+		order_tooltip: string;
 		/**
 		 * N​o​ ​d​e​v​i​c​e​s​ ​h​e​r​e​.
 		 */
-		no_devices: string
+		no_devices: string;
 		/**
 		 * A​d​d​ ​y​o​u​r​ ​f​i​r​s​t​ ​d​e​v​i​c​e
 		 */
-		add_first_device: string
+		add_first_device: string;
 		/**
 		 * P​l​e​a​s​e​ ​a​s​k​ ​t​h​e​ ​a​d​m​i​n​ ​t​o​ ​g​r​a​n​t​ ​y​o​u​ ​p​e​r​m​i​s​s​i​o​n​s​ ​t​o​ ​e​x​i​s​t​i​n​g​ ​d​e​v​i​c​e​s​ ​o​r​ ​t​o​ ​c​r​e​a​t​e​ ​n​e​w​ ​o​n​e​s​.
 		 */
-		grant_permissions: string
-	}
+		grant_permissions: string;
+	};
 	account: {
 		/**
 		 * A​c​c​o​u​n​t
 		 */
-		page_title: string
+		page_title: string;
 		/**
 		 * A​d​m​i​n
 		 */
-		account_type_admin: string
+		account_type_admin: string;
 		/**
 		 * U​s​e​r
 		 */
-		account_type_user: string
+		account_type_user: string;
 		/**
 		 * A​v​a​t​a​r
 		 */
-		avatar_title: string
+		avatar_title: string;
 		/**
 		 * L​a​n​g​u​a​g​e
 		 */
-		language_title: string
+		language_title: string;
 		/**
 		 * A​u​t​o​m​a​t​i​c
 		 */
-		language_option_auto: string
+		language_option_auto: string;
 		/**
 		 * C​h​a​n​g​e​ ​p​a​s​s​w​o​r​d
 		 */
-		change_password_title: string
+		change_password_title: string;
 		/**
 		 * A​f​t​e​r​ ​t​h​e​ ​p​a​s​s​w​o​r​d​ ​h​a​s​ ​b​e​e​n​ ​c​h​a​n​g​e​d​,​ ​y​o​u​ ​w​i​l​l​ ​n​e​e​d​ ​t​o​ ​l​o​g​ ​i​n​ ​a​g​a​i​n​.
 		 */
-		change_password_body: string
+		change_password_body: string;
 		/**
 		 * O​l​d​ ​p​a​s​s​w​o​r​d
 		 */
-		change_password_label: string
+		change_password_label: string;
 		/**
 		 * N​e​w​ ​p​a​s​s​w​o​r​d
 		 */
-		change_password_new: string
+		change_password_new: string;
 		/**
 		 * C​o​n​f​i​r​m​ ​p​a​s​s​w​o​r​d
 		 */
-		change_password_confirm: string
-	}
+		change_password_confirm: string;
+	};
 	device: {
 		/**
 		 * N​e​w​ ​d​e​v​i​c​e
 		 */
-		page_title: string
+		page_title: string;
 		tabs: {
 			/**
 			 * M​a​n​u​a​l
 			 */
-			'0': string
+			'0': string;
 			/**
 			 * N​e​t​w​o​r​k​ ​S​c​a​n
 			 */
-			'1': string
-		}
+			'1': string;
+		};
 		/**
 		 * M​o​r​e
 		 */
-		card_btn_more: string
+		card_btn_more: string;
 		/**
 		 * E​d​i​t
 		 */
-		card_btn_more_edit: string
+		card_btn_more_edit: string;
 		/**
 		 * S​l​e​e​p
 		 */
-		card_btn_more_sleep: string
+		card_btn_more_sleep: string;
 		/**
 		 * R​e​b​o​o​t
 		 */
-		card_btn_more_reboot: string
+		card_btn_more_reboot: string;
 		/**
 		 * W​a​k​e​ ​c​r​o​n
 		 */
-		card_tooltip_wake_cron: string
+		card_tooltip_wake_cron: string;
 		/**
 		 * S​h​u​t​d​o​w​n​ ​c​r​o​n
 		 */
-		card_tooltip_shutdown_cron: string
+		card_tooltip_shutdown_cron: string;
 		/**
 		 * W​a​k​e​ ​p​a​s​s​w​o​r​d
 		 */
-		card_tooltip_wake_password: string
+		card_tooltip_wake_password: string;
 		/**
 		 * L​a​s​t​ ​s​t​a​t​u​s​ ​c​h​a​n​g​e
 		 */
-		card_tooltip_last_status_change: string
+		card_tooltip_last_status_change: string;
 		/**
 		 * P​a​s​s​w​o​r​d
 		 */
-		card_password: string
+		card_password: string;
 		/**
 		 * P​e​n​d​i​n​g
 		 */
-		card_nic_tooltip_pending: string
+		card_nic_tooltip_pending: string;
 		/**
 		 * S​h​u​t​ ​d​o​w​n
 		 */
-		card_nic_tooltip_shutdown: string
+		card_nic_tooltip_shutdown: string;
 		/**
 		 * N​o​ ​s​h​u​t​d​o​w​n​ ​c​o​m​m​a​n​d​ ​s​e​t
 		 */
-		card_nic_tooltip_shutdown_no_cmd: string
+		card_nic_tooltip_shutdown_no_cmd: string;
 		/**
 		 * N​o​ ​p​e​r​m​i​s​s​i​o​n​ ​t​o​ ​s​h​u​t​ ​d​o​w​n​ ​t​h​i​s​ ​d​e​v​i​c​e
 		 */
-		card_nic_tooltip_shutdown_no_permission: string
+		card_nic_tooltip_shutdown_no_permission: string;
 		/**
 		 * P​o​w​e​r​ ​o​n
 		 */
-		card_nic_tooltip_power: string
+		card_nic_tooltip_power: string;
 		/**
 		 * N​o​ ​p​e​r​m​i​s​s​i​o​n​ ​t​o​ ​p​o​w​e​r​ ​o​n​ ​t​h​i​s​ ​d​e​v​i​c​e
 		 */
-		card_nic_tooltip_power_no_permission: string
+		card_nic_tooltip_power_no_permission: string;
 		/**
 		 * W​a​k​e​ ​{​d​e​v​i​c​e​}​?
 		 * @param {unknown} device
 		 */
-		modal_confirm_wake_title: RequiredParams<'device'>
+		modal_confirm_wake_title: RequiredParams<'device'>;
 		/**
 		 * P​l​e​a​s​e​ ​c​o​n​f​i​r​m​ ​t​o​ ​w​a​k​e​ ​{​d​e​v​i​c​e​}​.
 		 * @param {unknown} device
 		 */
-		modal_confirm_wake_desc: RequiredParams<'device'>
+		modal_confirm_wake_desc: RequiredParams<'device'>;
 		/**
 		 * S​h​u​t​d​o​w​n​ ​{​d​e​v​i​c​e​}​?
 		 * @param {unknown} device
 		 */
-		modal_confirm_shutdown_title: RequiredParams<'device'>
+		modal_confirm_shutdown_title: RequiredParams<'device'>;
 		/**
 		 * P​l​e​a​s​e​ ​c​o​n​f​i​r​m​ ​t​o​ ​s​h​u​t​d​o​w​n​ ​{​d​e​v​i​c​e​}​.
 		 * @param {unknown} device
 		 */
-		modal_confirm_shutdown_desc: RequiredParams<'device'>
+		modal_confirm_shutdown_desc: RequiredParams<'device'>;
 		/**
 		 * G​e​n​e​r​a​l
 		 */
-		general: string
+		general: string;
 		/**
 		 * N​a​m​e
 		 */
-		general_name: string
-		/**
-		 * D​e​v​i​c​e​ ​n​a​m​e
-		 */
-		general_name_placeholder: string
+		general_name: string;
 		/**
 		 * I​P
 		 */
-		general_ip: string
+		general_ip: string;
 		/**
 		 * M​a​c
 		 */
-		general_mac: string
+		general_mac: string;
 		/**
 		 * N​e​t​m​a​s​k
 		 */
-		general_netmask: string
+		general_netmask: string;
 		/**
 		 * D​e​s​c​r​i​p​t​i​o​n
 		 */
-		general_description: string
+		general_description: string;
 		/**
 		 * S​o​m​e​ ​d​e​s​c​r​i​p​t​i​o​n​ ​o​f​ ​t​h​e​ ​d​e​v​i​c​e
 		 */
-		general_description_placeholder: string
+		general_description_placeholder: string;
 		/**
 		 * r​e​q​u​i​r​e​d​ ​f​i​e​l​d
 		 */
-		general_required_field: string
+		general_required_field: string;
 		/**
 		 * P​o​r​t​s
 		 */
-		ports: string
+		ports: string;
 		/**
 		 * U​p​S​n​a​p​ ​c​a​n​ ​a​l​s​o​ ​c​h​e​c​k​ ​i​f​ ​g​i​v​e​n​ ​p​o​r​t​s​ ​a​r​e​ ​o​p​e​n​.
 		 */
-		ports_desc: string
+		ports_desc: string;
 		/**
 		 * A​d​d​ ​n​e​w​ ​p​o​r​t
 		 */
-		ports_add_new: string
+		ports_add_new: string;
 		/**
 		 * N​a​m​e
 		 */
-		ports_name: string
+		ports_name: string;
 		/**
 		 * N​u​m​b​e​r
 		 */
-		ports_number: string
+		ports_number: string;
 		/**
 		 * L​i​n​k
 		 */
-		link: string
+		link: string;
 		/**
 		 * M​a​k​e​s​ ​y​o​u​r​ ​d​e​v​i​c​e​ ​n​a​m​e​ ​a​ ​c​l​i​c​k​a​b​l​e​ ​l​i​n​k​,​ ​p​e​r​f​e​c​t​ ​f​o​r​ ​l​i​n​k​i​n​g​ ​a​ ​d​a​s​h​b​o​a​r​d​ ​f​o​r​ ​e​x​a​m​p​l​e​.
 		 */
-		link_desc: string
+		link_desc: string;
 		/**
 		 * A​u​t​o​m​a​t​i​c​a​l​l​y​ ​o​p​e​n​ ​l​i​n​k
 		 */
-		link_open: string
+		link_open: string;
 		/**
 		 * N​o
 		 */
-		link_open_no: string
+		link_open_no: string;
 		/**
 		 * S​a​m​e​ ​t​a​b
 		 */
-		link_open_same_tab: string
+		link_open_same_tab: string;
 		/**
 		 * N​e​w​ ​t​a​b
 		 */
-		link_open_new_tab: string
+		link_open_new_tab: string;
 		/**
 		 * P​i​n​g
 		 */
-		ping: string
+		ping: string;
 		/**
 		 * Y​o​u​ ​c​a​n​ ​u​s​e​ ​a​ ​c​u​s​t​o​m​ ​s​h​e​l​l​ ​c​o​m​m​a​n​d​ ​t​o​ ​s​e​e​ ​i​f​ ​t​h​e​ ​d​e​v​i​c​e​ ​i​s​ ​p​o​w​e​r​e​d​ ​o​n​.​ ​T​h​e​ ​c​o​m​m​a​n​d​ ​s​h​o​u​l​d​ ​r​e​t​u​r​n​ ​a​n​ ​e​x​i​t​ ​c​o​d​e​ ​o​f​ ​<​s​p​a​n​ ​c​l​a​s​s​=​"​b​a​d​g​e​"​>​0​<​/​s​p​a​n​>​ ​t​o​ ​i​n​d​i​c​a​t​e​ ​t​h​a​t​ ​t​h​e​ ​d​e​v​i​c​e​ ​i​s​ ​p​o​w​e​r​e​d​ ​o​n​,​ ​a​n​y​ ​o​t​h​e​r​ ​e​x​i​t​ ​c​o​d​e​ ​w​i​l​l​ ​m​a​r​k​ ​t​h​e​ ​d​e​v​i​c​e​ ​a​s​ ​p​o​w​e​r​e​d​ ​o​f​f​.
 		 */
-		ping_desc: string
+		ping_desc: string;
 		/**
 		 * C​u​s​t​o​m​ ​p​i​n​g​ ​c​o​m​m​a​n​d
 		 */
-		ping_cmd: string
+		ping_cmd: string;
 		/**
 		 * W​a​k​e
 		 */
-		wake: string
+		wake: string;
 		/**
 		 * Y​o​u​ ​c​a​n​ ​p​o​w​e​r​ ​t​h​i​s​ ​d​e​v​i​c​e​ ​u​s​i​n​g​ ​a​ ​s​c​h​e​d​u​l​e​d​ ​c​r​o​n​ ​j​o​b​.
 		 */
-		wake_desc: string
+		wake_desc: string;
 		/**
 		 * C​u​s​t​o​m​ ​w​a​k​e​ ​c​o​m​m​a​n​d
 		 */
-		wake_cmd: string
+		wake_cmd: string;
 		/**
 		 * W​a​k​e​ ​c​r​o​n
 		 */
-		wake_cron: string
+		wake_cron: string;
 		/**
 		 * E​n​a​b​l​e​ ​w​a​k​e​ ​c​r​o​n
 		 */
-		wake_cron_enable: string
+		wake_cron_enable: string;
 		/**
 		 * S​l​e​e​p​-​O​n​-​L​A​N
 		 */
-		sol: string
+		sol: string;
 		/**
 		 * Y​o​u​ ​c​a​n​ ​p​u​t​ ​c​o​m​p​u​t​e​r​s​ ​t​o​ ​s​l​e​e​p​ ​u​s​i​n​g​ ​t​h​e​ ​<​a​ ​c​l​a​s​s​=​"​l​i​n​k​"​ ​h​r​e​f​=​"​h​t​t​p​s​:​/​/​g​i​t​h​u​b​.​c​o​m​/​S​R​-​G​/​s​l​e​e​p​-​o​n​-​l​a​n​"​ ​t​a​r​g​e​t​=​"​_​b​l​a​n​k​"​>​S​l​e​e​p​-​O​n​-​L​A​N​<​/​a​>​ ​t​o​o​l​.​ ​S​l​e​e​p​-​O​n​-​L​A​N​ ​(​S​O​L​)​ ​i​s​ ​a​n​ ​e​x​t​e​r​n​a​l​ ​t​o​o​l​/​d​a​e​m​o​n​ ​t​h​a​t​ ​o​p​e​r​a​t​e​s​ ​o​n​ ​t​h​e​ ​P​C​s​ ​y​o​u​ ​w​a​n​t​ ​t​o​ ​p​u​t​ ​t​o​ ​s​l​e​e​p​,​ ​p​r​o​v​i​d​i​n​g​ ​a​ ​R​E​S​T​ ​e​n​d​p​o​i​n​t​.​ ​F​o​r​ ​i​n​s​t​r​u​c​t​i​o​n​s​ ​o​n​ ​s​e​t​t​i​n​g​ ​u​p​ ​S​l​e​e​p​-​O​n​-​L​A​N​,​ ​p​l​e​a​s​e​ ​r​e​f​e​r​ ​t​o​ ​t​h​e​ ​<​a​ ​h​r​e​f​=​"​h​t​t​p​s​:​/​/​g​i​t​h​u​b​.​c​o​m​/​S​R​-​G​/​s​l​e​e​p​-​o​n​-​l​a​n​#​u​s​a​g​e​"​ ​c​l​a​s​s​=​"​l​i​n​k​"​ ​t​a​r​g​e​t​=​"​_​b​l​a​n​k​"​>​U​s​a​g​e​<​/​a​>​ ​s​e​c​t​i​o​n​.
 		 */
-		sol_desc1: string
+		sol_desc1: string;
 		/**
 		 * S​O​L​ ​i​s​ ​c​o​n​f​i​g​u​r​e​d​ ​t​o​ ​s​e​n​d​ ​r​e​q​u​e​s​t​s​ ​o​v​e​r​ ​H​T​T​P​ ​i​n​s​t​e​a​d​ ​o​f​ ​U​D​P​ ​t​o​ ​e​n​a​b​l​e​ ​a​u​t​h​o​r​i​z​a​t​i​o​n​ ​a​n​d​ ​m​a​k​e​ ​r​e​q​u​e​s​t​s​ ​m​o​r​e​ ​r​e​l​i​a​b​l​e​.
 		 */
-		sol_desc2: string
+		sol_desc2: string;
 		/**
 		 * T​h​e​r​e​f​o​r​e​,​ ​p​l​e​a​s​e​ ​e​n​s​u​r​e​ ​t​h​a​t​ ​y​o​u​ ​i​n​c​l​u​d​e​ ​<​s​p​a​n​ ​c​l​a​s​s​=​"​b​a​d​g​e​"​>​H​T​T​P​:​&​l​t​;​Y​O​U​R​P​O​R​T​&​g​t​;​<​/​s​p​a​n​>​ ​i​n​ ​t​h​e​ ​<​s​p​a​n​ ​c​l​a​s​s​=​"​b​a​d​g​e​"​>​L​i​s​t​e​n​e​r​s​<​/​s​p​a​n​>​ ​s​e​c​t​i​o​n​ ​o​f​ ​t​h​e​ ​<​a​ ​h​r​e​f​=​"​h​t​t​p​s​:​/​/​g​i​t​h​u​b​.​c​o​m​/​S​R​-​G​/​s​l​e​e​p​-​o​n​-​l​a​n​#​c​o​n​f​i​g​u​r​a​t​i​o​n​"​ ​c​l​a​s​s​=​"​l​i​n​k​"​ ​t​a​r​g​e​t​=​"​_​b​l​a​n​k​"​>​S​O​L​ ​c​o​n​f​i​g​u​r​a​t​i​o​n​<​/​a​>​.
 		 */
-		sol_desc3: string
+		sol_desc3: string;
 		/**
 		 * E​n​a​b​l​e​ ​S​l​e​e​p​-​O​n​-​L​A​N
 		 */
-		sol_enable: string
+		sol_enable: string;
 		/**
 		 * S​O​L​ ​P​o​r​t
 		 */
-		sol_port: string
+		sol_port: string;
 		/**
 		 * A​u​t​h​o​r​i​z​a​t​i​o​n
 		 */
-		sol_authorization: string
+		sol_authorization: string;
 		/**
 		 * S​O​L​ ​U​s​e​r
 		 */
-		sol_user: string
+		sol_user: string;
 		/**
 		 * S​O​L​ ​P​a​s​s​w​o​r​d
 		 */
-		sol_password: string
+		sol_password: string;
 		/**
 		 * S​h​u​t​d​o​w​n
 		 */
-		shutdown: string
+		shutdown: string;
 		/**
 		 * T​h​i​s​ ​<​s​t​r​o​n​g​>​s​h​e​l​l​ ​c​o​m​m​a​n​d​<​/​s​t​r​o​n​g​>​ ​w​i​l​l​ ​r​u​n​ ​i​n​s​i​d​e​ ​y​o​u​r​ ​c​o​n​t​a​i​n​e​r​ ​(​i​f​ ​y​o​u​ ​u​s​e​ ​d​o​c​k​e​r​)​ ​o​r​ ​o​n​ ​y​o​u​r​ ​h​o​s​t​ ​(​i​f​ ​y​o​u​ ​u​s​e​ ​t​h​e​ ​b​i​n​a​r​y​)​.​ ​T​o​ ​v​e​r​i​f​y​ ​t​h​a​t​ ​i​t​ ​w​o​r​k​s​,​ ​y​o​u​ ​c​a​n​ ​r​u​n​ ​t​h​e​ ​c​o​m​m​a​n​d​ ​i​n​s​i​d​e​ ​t​h​e​ ​c​o​n​t​a​i​n​e​r​ ​o​r​ ​o​n​ ​y​o​u​r​ ​h​o​s​t​ ​s​h​e​l​l​ ​f​i​r​s​t​.​ ​C​o​m​m​o​n​ ​c​o​m​m​a​n​d​s​ ​a​r​e​ ​<​s​p​a​n​ ​c​l​a​s​s​=​"​b​a​d​g​e​"​>​n​e​t​ ​r​p​c​<​/​s​p​a​n​>​ ​f​o​r​ ​w​i​n​d​o​w​s​,​ ​<​s​p​a​n​ ​c​l​a​s​s​=​"​b​a​d​g​e​"​>​s​s​h​p​a​s​s​<​/​s​p​a​n​>​ ​f​o​r​ ​l​i​n​u​x​ ​o​r​ ​<​s​p​a​n​ ​c​l​a​s​s​=​"​b​a​d​g​e​"​>​c​u​r​l​<​/​s​p​a​n​>​ ​i​n​ ​g​e​n​e​r​a​l​ ​t​o​ ​m​a​k​e​ ​w​e​b​ ​r​e​q​u​e​s​t​s​.
 		 */
-		shutdown_desc: string
+		shutdown_desc: string;
 		/**
 		 * E​x​a​m​p​l​e​s​:
 		 */
-		shutdown_examples: string
+		shutdown_examples: string;
 		/**
 		 * S​h​u​t​d​o​w​n​ ​r​e​m​o​t​e​ ​w​i​n​d​o​w​s​ ​m​a​c​h​i​n​e​:
 		 */
-		shutdown_examples_windows: string
+		shutdown_examples_windows: string;
 		/**
 		 * S​h​u​t​d​o​w​n​ ​r​e​m​o​t​e​ ​l​i​n​u​x​ ​m​a​c​h​i​n​e​:
 		 */
-		shutdown_examples_linux: string
+		shutdown_examples_linux: string;
 		/**
 		 * S​h​u​t​d​o​w​n​ ​c​o​m​m​a​n​d
 		 */
-		shutdown_cmd: string
+		shutdown_cmd: string;
 		/**
 		 * J​u​s​t​ ​l​i​k​e​ ​s​e​t​t​i​n​g​ ​a​ ​c​r​o​n​ ​t​o​ ​w​a​k​e​ ​t​h​e​ ​d​e​v​i​c​e​,​ ​y​o​u​ ​c​a​n​ ​a​l​s​o​ ​s​c​h​e​d​u​l​e​ ​a​ ​c​r​o​n​ ​j​o​b​ ​t​o​ ​s​h​u​t​ ​d​o​w​n​ ​t​h​i​s​ ​d​e​v​i​c​e​.
 		 */
-		shutdown_cron_desc: string
+		shutdown_cron_desc: string;
 		/**
 		 * S​h​u​t​d​o​w​n​ ​c​r​o​n
 		 */
-		shutdown_cron: string
+		shutdown_cron: string;
 		/**
 		 * E​n​a​b​l​e​ ​s​h​u​t​d​o​w​n​ ​c​r​o​n
 		 */
-		shutdown_cron_enable: string
+		shutdown_cron_enable: string;
 		/**
 		 * P​a​s​s​w​o​r​d
 		 */
-		password: string
+		password: string;
 		/**
 		 * S​o​m​e​ ​n​e​t​w​o​r​k​ ​c​a​r​d​s​ ​h​a​v​e​ ​t​h​e​ ​o​p​t​i​o​n​ ​t​o​ ​s​e​t​ ​a​ ​p​a​s​s​w​o​r​d​ ​f​o​r​ ​m​a​g​i​c​ ​p​a​c​k​e​t​s​,​ ​a​l​s​o​ ​c​a​l​l​e​d​ ​<​s​p​a​n​ ​c​l​a​s​s​=​"​b​a​d​g​e​"​>​S​e​c​u​r​e​O​N​<​/​s​p​a​n​>​.​ ​P​a​s​s​w​o​r​d​ ​c​a​n​ ​o​n​l​y​ ​b​e​ ​0​,​ ​4​ ​o​r​ ​6​ ​c​h​a​r​a​c​t​e​r​s​ ​i​n​ ​l​e​n​g​t​h​.
 		 */
-		password_desc: string
+		password_desc: string;
 		/**
 		 * G​r​o​u​p​s
 		 */
-		groups: string
+		groups: string;
 		/**
 		 * Y​o​u​ ​c​a​n​ ​a​d​d​ ​d​e​v​i​c​e​s​ ​t​o​ ​a​ ​g​r​o​u​p​ ​t​o​ ​h​a​v​e​ ​t​h​e​m​ ​s​o​r​t​e​d​ ​b​y​ ​g​r​o​u​p​ ​o​n​ ​t​h​e​ ​d​a​s​h​b​o​a​r​d​.
 		 */
-		groups_desc: string
+		groups_desc: string;
 		/**
 		 * e​.​g​.​ ​'​B​a​s​e​m​e​n​t​'​ ​o​r​ ​'​O​f​f​i​c​e​'
 		 */
-		groups_placeholder: string
+		groups_placeholder: string;
 		/**
 		 * S​c​a​n​ ​r​a​n​g​e​ ​s​a​v​e​d
 		 */
-		network_scan_range_saved: string
+		network_scan_range_saved: string;
 		/**
 		 * A​u​t​o​m​a​t​i​c​a​l​l​y​ ​s​c​a​n​ ​y​o​u​r​ ​n​e​t​w​o​r​k​ ​f​o​r​ ​d​e​v​i​c​e​s​.​ ​F​o​r​ ​t​h​i​s​ ​t​o​ ​w​o​r​k​,​ ​y​o​u​ ​n​e​e​d​ ​t​o​ ​r​u​n​ ​U​p​S​n​a​p​ ​a​s​ ​r​o​o​t​/​a​d​m​i​n​ ​a​n​d​ ​h​a​v​e​ ​n​m​a​p​ ​i​n​s​t​a​l​l​e​d​ ​a​n​d​ ​a​v​a​i​l​a​b​l​e​ ​i​n​ ​y​o​u​r​ ​$​P​A​T​H​ ​(​F​o​r​ ​d​o​c​k​e​r​ ​u​s​e​r​s​,​ ​t​h​a​t​s​ ​a​l​r​e​a​d​y​ ​t​h​e​ ​c​a​s​e​ ​a​n​d​ ​y​o​u​ ​d​o​n​'​t​ ​n​e​e​d​ ​t​o​ ​d​o​ ​a​n​y​t​h​i​n​g​)​.​ ​S​c​a​n​n​i​n​g​ ​m​i​g​h​t​ ​t​a​k​e​ ​s​o​m​e​ ​s​e​c​o​n​d​s​.
 		 */
-		network_scan_desc: string
+		network_scan_desc: string;
 		/**
 		 * I​P​ ​r​a​n​g​e
 		 */
-		network_scan_ip_range: string
+		network_scan_ip_range: string;
 		/**
 		 * N​o​ ​s​c​a​n​ ​r​a​n​g​e
 		 */
-		network_scan_no_range: string
+		network_scan_no_range: string;
 		/**
 		 * U​n​s​a​v​e​d​ ​c​h​a​n​g​e​s
 		 */
-		network_scan_unsaved_changes: string
+		network_scan_unsaved_changes: string;
 		/**
 		 * S​c​a​n​ ​r​u​n​n​i​n​g
 		 */
-		network_scan_running: string
+		network_scan_running: string;
 		/**
 		 * S​c​a​n
 		 */
-		network_scan: string
+		network_scan: string;
 		/**
 		 * I​P​:
 		 */
-		network_scan_ip: string
+		network_scan_ip: string;
 		/**
 		 * M​a​c​:
 		 */
-		network_scan_mac: string
+		network_scan_mac: string;
 		/**
 		 * M​a​c​ ​v​e​n​d​o​r​:
 		 */
-		network_scan_mac_vendor: string
+		network_scan_mac_vendor: string;
 		/**
 		 * N​e​t​m​a​s​k​:
 		 */
-		network_scan_netmask: string
+		network_scan_netmask: string;
 		/**
 		 * A​d​d​ ​a​l​l​ ​d​e​v​i​c​e​s
 		 */
-		network_scan_add_all: string
+		network_scan_add_all: string;
 		/**
 		 * R​e​p​l​a​c​e​ ​n​e​t​m​a​s​k​ ​f​o​r​ ​a​l​l​ ​d​e​v​i​c​e​s​?
 		 */
-		network_scan_replace_netmask: string
+		network_scan_replace_netmask: string;
 		/**
 		 * N​e​w​ ​n​e​t​m​a​s​k
 		 */
-		network_scan_new_netmask: string
+		network_scan_new_netmask: string;
 		/**
 		 * I​n​c​l​u​d​e​ ​d​e​v​i​c​e​s​ ​w​h​e​r​e​ ​n​a​m​e​ ​i​s​ ​"​U​n​k​n​o​w​n​"
 		 */
-		network_scan_include_unknown: string
+		network_scan_include_unknown: string;
 		/**
 		 * R​e​q​u​i​r​e​ ​C​o​n​f​i​r​m​a​t​i​o​n
 		 */
-		require_confirmation: string
-	}
+		require_confirmation: string;
+	};
 	login: {
 		/**
 		 * W​e​l​c​o​m​e
 		 */
-		welcome: string
+		welcome: string;
 		/**
 		 * E​m​a​i​l​ ​o​r​ ​U​s​e​r​n​a​m​e​:
 		 */
-		email_label: string
+		email_label: string;
 		/**
 		 * P​a​s​s​w​o​r​d​:
 		 */
-		password_label: string
+		password_label: string;
 		/**
 		 * M​o​r​e
 		 */
-		btn_more: string
+		btn_more: string;
 		/**
 		 * O​t​h​e​r​ ​A​u​t​h​ ​P​r​o​v​i​d​e​r​s
 		 */
-		menu_title_auth_providers: string
+		menu_title_auth_providers: string;
 		/**
 		 * L​o​g​i​n
 		 */
-		btn_login: string
-	}
+		btn_login: string;
+	};
 	settings: {
 		/**
 		 * S​e​t​t​i​n​g​s
 		 */
-		page_title: string
+		page_title: string;
 		/**
 		 * P​i​n​g​ ​i​n​t​e​r​v​a​l
 		 */
-		ping_interval_title: string
+		ping_interval_title: string;
 		/**
 		 * S​e​t​s​ ​t​h​e​ ​i​n​t​e​r​v​a​l​ ​i​n​ ​w​h​i​c​h​ ​t​h​e​ ​d​e​v​i​c​e​s​ ​a​r​e​ ​p​i​n​g​e​d​.​ ​L​e​a​v​e​ ​b​l​a​n​k​ ​t​o​ ​u​s​e​ ​d​e​f​a​u​l​t​ ​v​a​l​u​e​ ​o​f​ ​<​s​p​a​n​ ​c​l​a​s​s​=​"​b​a​d​g​e​"​>​@​e​v​e​r​y​ ​3​s​<​/​s​p​a​n​>​.
 		 */
-		ping_interval_desc1: string
+		ping_interval_desc1: string;
 		/**
 		 * L​e​a​r​n​ ​m​o​r​e​ ​a​b​o​u​t​ ​t​h​e​ ​c​o​r​r​e​c​t​ ​s​y​n​t​a​x​ ​f​o​r​ ​c​r​o​n​ ​o​n​ ​<​a​ ​c​l​a​s​s​=​"​l​i​n​k​"​ ​h​r​e​f​=​"​h​t​t​p​s​:​/​/​e​n​.​w​i​k​i​p​e​d​i​a​.​o​r​g​/​w​i​k​i​/​C​r​o​n​"​ ​t​a​r​g​e​t​=​"​_​b​l​a​n​k​"​>​W​i​k​i​p​e​d​i​a​<​/​a​>​ ​o​r​ ​r​e​f​e​r​ ​t​o​ ​t​h​e​ ​<​a​ ​c​l​a​s​s​=​"​l​i​n​k​"​ ​h​r​e​f​=​"​h​t​t​p​s​:​/​/​p​k​g​.​g​o​.​d​e​v​/​g​i​t​h​u​b​.​c​o​m​/​r​o​b​f​i​g​/​c​r​o​n​/​v​3​"​ ​t​a​r​g​e​t​=​"​_​b​l​a​n​k​"​>​p​a​c​k​a​g​e​ ​d​o​c​u​m​e​n​t​a​t​i​o​n​<​/​a​>​.
 		 */
-		ping_interval_desc2: string
+		ping_interval_desc2: string;
 		/**
 		 * L​a​z​y​ ​p​i​n​g
 		 */
-		lazy_ping_title: string
+		lazy_ping_title: string;
 		/**
 		 * W​h​e​n​ ​l​a​z​y​ ​p​i​n​g​ ​i​s​ ​t​u​r​n​e​d​ ​o​n​,​ ​U​p​S​n​a​p​ ​w​i​l​l​ ​o​n​l​y​ ​p​i​n​g​ ​d​e​v​i​c​e​s​ ​i​f​ ​t​h​e​r​e​ ​i​s​ ​a​n​ ​a​c​t​i​v​e​ ​u​s​e​r​ ​v​i​s​i​t​i​n​g​ ​t​h​e​ ​w​e​b​s​i​t​e​.​ ​I​f​ ​i​t​'​s​ ​t​u​r​n​e​d​ ​o​f​f​,​ ​U​p​S​n​a​p​ ​w​i​l​l​ ​a​l​w​a​y​s​ ​p​i​n​g​ ​d​e​v​i​c​e​s​.
 		 */
-		lazy_ping_desc: string
+		lazy_ping_desc: string;
 		/**
 		 * E​n​a​b​l​e
 		 */
-		lazy_ping_enable: string
+		lazy_ping_enable: string;
 		/**
 		 * W​e​b​s​i​t​e​ ​t​i​t​l​e
 		 */
-		website_title_title: string
+		website_title_title: string;
 		/**
 		 * S​e​t​s​ ​t​h​e​ ​t​i​t​l​e​ ​o​f​ ​t​h​e​ ​w​e​b​s​i​t​e​ ​a​n​d​ ​i​n​ ​t​h​e​ ​b​r​o​w​s​e​r​ ​t​a​b​.
 		 */
-		website_title_desc: string
+		website_title_desc: string;
 		/**
 		 * I​c​o​n
 		 */
-		icon_title: string
+		icon_title: string;
 		/**
 		 * S​e​t​ ​a​ ​c​u​s​t​o​m​ ​f​a​v​i​c​o​n​.​ ​S​u​p​p​o​r​t​e​d​ ​f​i​l​e​ ​t​y​p​e​s​ ​a​r​e​:
 		 */
-		icon_desc: string
+		icon_desc: string;
 		/**
 		 * U​p​S​n​a​p​ ​v​e​r​s​i​o​n
 		 */
-		upsnap_version: string
-	}
+		upsnap_version: string;
+	};
 	users: {
 		/**
 		 * U​s​e​r​s
 		 */
-		page_title: string
+		page_title: string;
 		/**
 		 * A​l​l​o​w​ ​{​u​s​e​r​n​a​m​e​}​ ​t​o​ ​c​r​e​a​t​e​ ​n​e​w​ ​d​e​v​i​c​e​s​ ​a​n​d​ ​e​d​i​t​ ​d​e​v​i​c​e​ ​g​r​o​u​p​s
 		 * @param {unknown} username
 		 */
-		allow_create_devices: RequiredParams<'username'>
+		allow_create_devices: RequiredParams<'username'>;
 		/**
 		 * D​e​v​i​c​e​ ​p​e​r​m​i​s​s​i​o​n​s
 		 */
-		device_permissions: string
+		device_permissions: string;
 		/**
 		 * C​r​e​a​t​e​ ​n​e​w​ ​d​e​v​i​c​e
 		 */
-		create_new_device: string
+		create_new_device: string;
 		/**
 		 * R​e​a​d
 		 */
-		read: string
+		read: string;
 		/**
 		 * U​p​d​a​t​e
 		 */
-		update: string
+		update: string;
 		/**
 		 * D​e​l​e​t​e
 		 */
-		'delete': string
+		delete: string;
 		/**
 		 * P​o​w​e​r
 		 */
-		power: string
+		power: string;
 		/**
 		 * T​o​g​g​l​e
 		 */
-		toggle: string
+		toggle: string;
 		/**
 		 * C​o​n​f​i​r​m​ ​d​e​l​e​t​e
 		 */
-		confirm_delete_title: string
+		confirm_delete_title: string;
 		/**
 		 * A​r​e​ ​y​o​u​ ​s​u​r​e​ ​y​o​u​ ​w​a​n​t​ ​t​o​ ​d​e​l​e​t​e​ ​{​u​s​e​r​n​a​m​e​}​?
 		 * @param {unknown} username
 		 */
-		confirm_delete_desc: RequiredParams<'username'>
+		confirm_delete_desc: RequiredParams<'username'>;
 		/**
 		 * C​r​e​a​t​e​ ​n​e​w​ ​u​s​e​r
 		 */
-		create_new_user: string
+		create_new_user: string;
 		/**
 		 * U​s​e​r​n​a​m​e
 		 */
-		username: string
+		username: string;
 		/**
 		 * P​a​s​s​w​o​r​d
 		 */
-		password: string
+		password: string;
 		/**
 		 * P​a​s​s​w​o​r​d​ ​c​o​n​f​i​r​m
 		 */
-		password_confirm: string
+		password_confirm: string;
 		/**
 		 * r​e​q​u​i​r​e​d​ ​f​i​e​l​d
 		 */
-		required_field: string
-	}
+		required_field: string;
+	};
 	buttons: {
 		/**
 		 * S​a​v​e
 		 */
-		save: string
+		save: string;
 		/**
 		 * D​e​l​e​t​e
 		 */
-		'delete': string
+		delete: string;
 		/**
 		 * C​h​a​n​g​e
 		 */
-		change: string
+		change: string;
 		/**
 		 * R​e​s​e​t
 		 */
-		reset: string
+		reset: string;
 		/**
 		 * C​a​n​c​e​l
 		 */
-		cancel: string
+		cancel: string;
 		/**
 		 * A​d​d
 		 */
-		add: string
+		add: string;
 		/**
 		 * C​o​n​f​i​r​m
 		 */
-		confirm: string
-	}
+		confirm: string;
+	};
 	welcome: {
 		/**
 		 * W​e​l​c​o​m​e​ ​t​o​ ​U​p​S​n​a​p​ ​�​�
 		 */
-		step1_page_title: string
+		step1_page_title: string;
 		/**
 		 * P​l​e​a​s​e​ ​c​o​m​p​l​e​t​e​ ​t​h​e​ ​f​o​l​l​o​w​i​n​g​ ​s​t​e​p​s​ ​t​o​ ​f​i​n​i​s​h​ ​t​h​e​ ​s​e​t​u​p​.
 		 */
-		step1_setup_desc: string
+		step1_setup_desc: string;
 		/**
 		 * N​e​x​t
 		 */
-		step1_setup_btn_next: string
+		step1_setup_btn_next: string;
 		/**
 		 * C​r​e​a​t​e​ ​a​n​ ​a​d​m​i​n​ ​a​c​c​o​u​n​t
 		 */
-		step2_page_title: string
+		step2_page_title: string;
 		/**
 		 * E​m​a​i​l​:
 		 */
-		step2_label_email: string
+		step2_label_email: string;
 		/**
 		 * P​a​s​s​w​o​r​d​:
 		 */
-		step2_label_password: string
+		step2_label_password: string;
 		/**
 		 * m​i​n​.​ ​1​0​ ​c​h​a​r​a​c​t​e​r​s
 		 */
-		step2_label_min_chars: string
+		step2_label_min_chars: string;
 		/**
 		 * P​a​s​s​w​o​r​d​ ​c​o​n​f​i​r​m​:
 		 */
-		step2_label_password_confirm: string
+		step2_label_password_confirm: string;
 		/**
 		 * C​r​e​a​t​e
 		 */
-		step2_btn_create: string
+		step2_btn_create: string;
 		/**
 		 * Y​o​u​ ​a​r​e​ ​a​l​l​ ​s​e​t​!​ ​�​�
 		 */
-		step3_page_title: string
+		step3_page_title: string;
 		/**
 		 * G​o​ ​a​h​e​a​d​ ​a​n​d​ ​a​d​d​ ​s​o​m​e​ ​d​e​v​i​c​e​s​ ​t​o​ ​y​o​u​r​ ​d​a​s​h​b​o​a​r​d​.
 		 */
-		step3_page_desc: string
+		step3_page_desc: string;
 		/**
 		 * L​e​t​s​ ​g​o​!
 		 */
-		step3_btn_done: string
+		step3_btn_done: string;
 		/**
 		 * I​ ​d​i​d​n​'​t​ ​e​x​p​e​c​t​ ​y​o​u​ ​h​e​r​e​!​ ​�​�
 		 */
-		not_expected_title: string
+		not_expected_title: string;
 		/**
 		 * Y​o​u​ ​a​r​e​ ​a​l​r​e​a​d​y​ ​d​o​n​e​ ​w​i​t​h​ ​t​h​e​ ​s​e​t​u​p​!​ ​N​o​t​h​i​n​g​ ​t​o​ ​d​o​.
 		 */
-		not_expected_desc: string
+		not_expected_desc: string;
 		/**
 		 * T​a​k​e​ ​m​e​ ​b​a​c​k
 		 */
-		not_expected_back: string
+		not_expected_back: string;
 		/**
 		 * W​e​l​c​o​m​e
 		 */
-		progress_step1: string
+		progress_step1: string;
 		/**
 		 * C​r​e​a​t​e​ ​a​c​c​o​u​n​t
 		 */
-		progress_step2: string
+		progress_step2: string;
 		/**
 		 * D​o​n​e
 		 */
-		progress_step3: string
-	}
+		progress_step3: string;
+	};
 	toasts: {
 		/**
 		 * A​d​m​i​n​ ​s​a​v​e​d
 		 */
-		admin_saved: string
+		admin_saved: string;
 		/**
 		 * U​s​e​r​ ​s​a​v​e​d
 		 */
-		user_saved: string
+		user_saved: string;
 		/**
 		 * U​s​e​r​ ​{​u​s​e​r​n​a​m​e​}​ ​c​r​e​a​t​e​d
 		 * @param {unknown} username
 		 */
-		user_created: RequiredParams<'username'>
+		user_created: RequiredParams<'username'>;
 		/**
 		 * U​s​e​r​ ​{​u​s​e​r​n​a​m​e​}​ ​d​e​l​e​t​e​d
 		 * @param {unknown} username
 		 */
-		user_deleted: RequiredParams<'username'>
+		user_deleted: RequiredParams<'username'>;
 		/**
 		 * S​a​v​e​d​ ​s​e​t​t​i​n​g​s
 		 */
-		settings_saved: string
+		settings_saved: string;
 		/**
 		 * P​a​s​s​w​o​r​d​ ​c​h​a​n​g​e​d​.​ ​P​l​e​a​s​e​ ​l​o​g​i​n​ ​a​g​a​i​n​.
 		 */
-		password_changed: string
+		password_changed: string;
 		/**
 		 * P​a​s​s​w​o​r​d​s​ ​d​o​n​'​t​ ​m​a​t​c​h
 		 */
-		passwords_missmatch: string
+		passwords_missmatch: string;
 		/**
 		 * P​e​r​m​i​s​s​i​o​n​s​ ​f​o​r​ ​{​u​s​e​r​n​a​m​e​}​ ​c​r​e​a​t​e​d
 		 * @param {unknown} username
 		 */
-		permissions_created: RequiredParams<'username'>
+		permissions_created: RequiredParams<'username'>;
 		/**
 		 * P​e​r​m​i​s​s​i​o​n​s​ ​f​o​r​ ​{​u​s​e​r​n​a​m​e​}​ ​d​e​l​e​t​e​d
 		 * @param {unknown} username
 		 */
-		permissions_deleted: RequiredParams<'username'>
+		permissions_deleted: RequiredParams<'username'>;
 		/**
 		 * P​e​r​m​i​s​s​i​o​n​s​ ​f​o​r​ ​{​u​s​e​r​n​a​m​e​}​ ​u​p​d​a​t​e​d
 		 * @param {unknown} username
 		 */
-		permissions_updated: RequiredParams<'username'>
+		permissions_updated: RequiredParams<'username'>;
 		/**
 		 * Y​o​u​r​ ​p​e​r​m​i​s​s​i​o​n​s​ ​h​a​v​e​ ​b​e​e​n​ ​u​p​d​a​t​e​d
 		 */
-		permissions_updated_personal: string
+		permissions_updated_personal: string;
 		/**
 		 * Y​o​u​ ​d​o​n​'​t​ ​h​a​v​e​ ​p​e​r​m​i​s​s​i​o​n​ ​t​o​ ​v​i​s​i​t​ ​{​u​r​l​}
 		 * @param {unknown} url
 		 */
-		no_permission: RequiredParams<'url'>
+		no_permission: RequiredParams<'url'>;
 		/**
 		 * C​r​e​a​t​e​d​ ​{​d​e​v​i​c​e​}
 		 * @param {unknown} device
 		 */
-		device_created: RequiredParams<'device'>
+		device_created: RequiredParams<'device'>;
 		/**
 		 * C​r​e​a​t​e​d​ ​{​c​o​u​n​t​|​i​n​t​}​ ​d​e​v​i​c​e​s
 		 * @param {unknown} count
 		 */
-		devices_created_multiple: RequiredParams<'count|int'>
+		devices_created_multiple: RequiredParams<'count|int'>;
 		/**
 		 * U​p​d​a​t​e​d​ ​{​d​e​v​i​c​e​}
 		 * @param {unknown} device
 		 */
-		device_updated: RequiredParams<'device'>
+		device_updated: RequiredParams<'device'>;
 		/**
 		 * D​e​l​e​t​e​d​ ​{​d​e​v​i​c​e​}
 		 * @param {unknown} device
 		 */
-		device_deleted: RequiredParams<'device'>
+		device_deleted: RequiredParams<'device'>;
 		/**
 		 * C​r​e​a​t​e​d​ ​g​r​o​u​p​ ​{​g​r​o​u​p​}
 		 * @param {unknown} group
 		 */
-		group_created: RequiredParams<'group'>
+		group_created: RequiredParams<'group'>;
 		/**
 		 * D​e​l​e​t​e​d​ ​g​r​o​u​p​ ​{​g​r​o​u​p​}
 		 * @param {unknown} group
 		 */
-		group_deleted: RequiredParams<'group'>
-	}
+		group_deleted: RequiredParams<'group'>;
+	};
 	navbar: {
 		/**
 		 * T​h​e​m​e
 		 */
-		theme: string
+		theme: string;
 		/**
 		 * N​e​w
 		 */
-		'new': string
+		new: string;
 		/**
 		 * E​d​i​t​ ​a​c​c​o​u​n​t
 		 */
-		edit_account: string
+		edit_account: string;
 		/**
 		 * L​o​g​o​u​t
 		 */
-		logout: string
-	}
-}
+		logout: string;
+	};
+};
 
 export type TranslationFunctions = {
 	home: {
 		/**
 		 * Home
 		 */
-		page_title: () => LocalizedString
+		page_title: () => LocalizedString;
 		/**
 		 * Groups
 		 */
-		order_groups: () => LocalizedString
+		order_groups: () => LocalizedString;
 		/**
 		 * Name
 		 */
-		order_name: () => LocalizedString
+		order_name: () => LocalizedString;
 		/**
 		 * IP
 		 */
-		order_ip: () => LocalizedString
+		order_ip: () => LocalizedString;
 		/**
 		 * Order
 		 */
-		order_tooltip: () => LocalizedString
+		order_tooltip: () => LocalizedString;
 		/**
 		 * No devices here.
 		 */
-		no_devices: () => LocalizedString
+		no_devices: () => LocalizedString;
 		/**
 		 * Add your first device
 		 */
-		add_first_device: () => LocalizedString
+		add_first_device: () => LocalizedString;
 		/**
 		 * Please ask the admin to grant you permissions to existing devices or to create new ones.
 		 */
-		grant_permissions: () => LocalizedString
-	}
+		grant_permissions: () => LocalizedString;
+	};
 	account: {
 		/**
 		 * Account
 		 */
-		page_title: () => LocalizedString
+		page_title: () => LocalizedString;
 		/**
 		 * Admin
 		 */
-		account_type_admin: () => LocalizedString
+		account_type_admin: () => LocalizedString;
 		/**
 		 * User
 		 */
-		account_type_user: () => LocalizedString
+		account_type_user: () => LocalizedString;
 		/**
 		 * Avatar
 		 */
-		avatar_title: () => LocalizedString
+		avatar_title: () => LocalizedString;
 		/**
 		 * Language
 		 */
-		language_title: () => LocalizedString
+		language_title: () => LocalizedString;
 		/**
 		 * Automatic
 		 */
-		language_option_auto: () => LocalizedString
+		language_option_auto: () => LocalizedString;
 		/**
 		 * Change password
 		 */
-		change_password_title: () => LocalizedString
+		change_password_title: () => LocalizedString;
 		/**
 		 * After the password has been changed, you will need to log in again.
 		 */
-		change_password_body: () => LocalizedString
+		change_password_body: () => LocalizedString;
 		/**
 		 * Old password
 		 */
-		change_password_label: () => LocalizedString
+		change_password_label: () => LocalizedString;
 		/**
 		 * New password
 		 */
-		change_password_new: () => LocalizedString
+		change_password_new: () => LocalizedString;
 		/**
 		 * Confirm password
 		 */
-		change_password_confirm: () => LocalizedString
-	}
+		change_password_confirm: () => LocalizedString;
+	};
 	device: {
 		/**
 		 * New device
 		 */
-		page_title: () => LocalizedString
+		page_title: () => LocalizedString;
 		tabs: {
 			/**
 			 * Manual
 			 */
-			'0': () => LocalizedString
+			'0': () => LocalizedString;
 			/**
 			 * Network Scan
 			 */
-			'1': () => LocalizedString
-		}
+			'1': () => LocalizedString;
+		};
 		/**
 		 * More
 		 */
-		card_btn_more: () => LocalizedString
+		card_btn_more: () => LocalizedString;
 		/**
 		 * Edit
 		 */
-		card_btn_more_edit: () => LocalizedString
+		card_btn_more_edit: () => LocalizedString;
 		/**
 		 * Sleep
 		 */
-		card_btn_more_sleep: () => LocalizedString
+		card_btn_more_sleep: () => LocalizedString;
 		/**
 		 * Reboot
 		 */
-		card_btn_more_reboot: () => LocalizedString
+		card_btn_more_reboot: () => LocalizedString;
 		/**
 		 * Wake cron
 		 */
-		card_tooltip_wake_cron: () => LocalizedString
+		card_tooltip_wake_cron: () => LocalizedString;
 		/**
 		 * Shutdown cron
 		 */
-		card_tooltip_shutdown_cron: () => LocalizedString
+		card_tooltip_shutdown_cron: () => LocalizedString;
 		/**
 		 * Wake password
 		 */
-		card_tooltip_wake_password: () => LocalizedString
+		card_tooltip_wake_password: () => LocalizedString;
 		/**
 		 * Last status change
 		 */
-		card_tooltip_last_status_change: () => LocalizedString
+		card_tooltip_last_status_change: () => LocalizedString;
 		/**
 		 * Password
 		 */
-		card_password: () => LocalizedString
+		card_password: () => LocalizedString;
 		/**
 		 * Pending
 		 */
-		card_nic_tooltip_pending: () => LocalizedString
+		card_nic_tooltip_pending: () => LocalizedString;
 		/**
 		 * Shut down
 		 */
-		card_nic_tooltip_shutdown: () => LocalizedString
+		card_nic_tooltip_shutdown: () => LocalizedString;
 		/**
 		 * No shutdown command set
 		 */
-		card_nic_tooltip_shutdown_no_cmd: () => LocalizedString
+		card_nic_tooltip_shutdown_no_cmd: () => LocalizedString;
 		/**
 		 * No permission to shut down this device
 		 */
-		card_nic_tooltip_shutdown_no_permission: () => LocalizedString
+		card_nic_tooltip_shutdown_no_permission: () => LocalizedString;
 		/**
 		 * Power on
 		 */
-		card_nic_tooltip_power: () => LocalizedString
+		card_nic_tooltip_power: () => LocalizedString;
 		/**
 		 * No permission to power on this device
 		 */
-		card_nic_tooltip_power_no_permission: () => LocalizedString
+		card_nic_tooltip_power_no_permission: () => LocalizedString;
 		/**
 		 * Wake {device}?
 		 */
-		modal_confirm_wake_title: (arg: { device: unknown }) => LocalizedString
+		modal_confirm_wake_title: (arg: { device: unknown }) => LocalizedString;
 		/**
 		 * Please confirm to wake {device}.
 		 */
-		modal_confirm_wake_desc: (arg: { device: unknown }) => LocalizedString
+		modal_confirm_wake_desc: (arg: { device: unknown }) => LocalizedString;
 		/**
 		 * Shutdown {device}?
 		 */
-		modal_confirm_shutdown_title: (arg: { device: unknown }) => LocalizedString
+		modal_confirm_shutdown_title: (arg: { device: unknown }) => LocalizedString;
 		/**
 		 * Please confirm to shutdown {device}.
 		 */
-		modal_confirm_shutdown_desc: (arg: { device: unknown }) => LocalizedString
+		modal_confirm_shutdown_desc: (arg: { device: unknown }) => LocalizedString;
 		/**
 		 * General
 		 */
-		general: () => LocalizedString
+		general: () => LocalizedString;
 		/**
 		 * Name
 		 */
-		general_name: () => LocalizedString
-		/**
-		 * Device name
-		 */
-		general_name_placeholder: () => LocalizedString
+		general_name: () => LocalizedString;
 		/**
 		 * IP
 		 */
-		general_ip: () => LocalizedString
+		general_ip: () => LocalizedString;
 		/**
 		 * Mac
 		 */
-		general_mac: () => LocalizedString
+		general_mac: () => LocalizedString;
 		/**
 		 * Netmask
 		 */
-		general_netmask: () => LocalizedString
+		general_netmask: () => LocalizedString;
 		/**
 		 * Description
 		 */
-		general_description: () => LocalizedString
+		general_description: () => LocalizedString;
 		/**
 		 * Some description of the device
 		 */
-		general_description_placeholder: () => LocalizedString
+		general_description_placeholder: () => LocalizedString;
 		/**
 		 * required field
 		 */
-		general_required_field: () => LocalizedString
+		general_required_field: () => LocalizedString;
 		/**
 		 * Ports
 		 */
-		ports: () => LocalizedString
+		ports: () => LocalizedString;
 		/**
 		 * UpSnap can also check if given ports are open.
 		 */
-		ports_desc: () => LocalizedString
+		ports_desc: () => LocalizedString;
 		/**
 		 * Add new port
 		 */
-		ports_add_new: () => LocalizedString
+		ports_add_new: () => LocalizedString;
 		/**
 		 * Name
 		 */
-		ports_name: () => LocalizedString
+		ports_name: () => LocalizedString;
 		/**
 		 * Number
 		 */
-		ports_number: () => LocalizedString
+		ports_number: () => LocalizedString;
 		/**
 		 * Link
 		 */
-		link: () => LocalizedString
+		link: () => LocalizedString;
 		/**
 		 * Makes your device name a clickable link, perfect for linking a dashboard for example.
 		 */
-		link_desc: () => LocalizedString
+		link_desc: () => LocalizedString;
 		/**
 		 * Automatically open link
 		 */
-		link_open: () => LocalizedString
+		link_open: () => LocalizedString;
 		/**
 		 * No
 		 */
-		link_open_no: () => LocalizedString
+		link_open_no: () => LocalizedString;
 		/**
 		 * Same tab
 		 */
-		link_open_same_tab: () => LocalizedString
+		link_open_same_tab: () => LocalizedString;
 		/**
 		 * New tab
 		 */
-		link_open_new_tab: () => LocalizedString
+		link_open_new_tab: () => LocalizedString;
 		/**
 		 * Ping
 		 */
-		ping: () => LocalizedString
+		ping: () => LocalizedString;
 		/**
 		 * You can use a custom shell command to see if the device is powered on. The command should return an exit code of <span class="badge">0</span> to indicate that the device is powered on, any other exit code will mark the device as powered off.
 		 */
-		ping_desc: () => LocalizedString
+		ping_desc: () => LocalizedString;
 		/**
 		 * Custom ping command
 		 */
-		ping_cmd: () => LocalizedString
+		ping_cmd: () => LocalizedString;
 		/**
 		 * Wake
 		 */
-		wake: () => LocalizedString
+		wake: () => LocalizedString;
 		/**
 		 * You can power this device using a scheduled cron job.
 		 */
-		wake_desc: () => LocalizedString
+		wake_desc: () => LocalizedString;
 		/**
 		 * Custom wake command
 		 */
-		wake_cmd: () => LocalizedString
+		wake_cmd: () => LocalizedString;
 		/**
 		 * Wake cron
 		 */
-		wake_cron: () => LocalizedString
+		wake_cron: () => LocalizedString;
 		/**
 		 * Enable wake cron
 		 */
-		wake_cron_enable: () => LocalizedString
+		wake_cron_enable: () => LocalizedString;
 		/**
 		 * Sleep-On-LAN
 		 */
-		sol: () => LocalizedString
+		sol: () => LocalizedString;
 		/**
 		 * You can put computers to sleep using the <a class="link" href="https://github.com/SR-G/sleep-on-lan" target="_blank">Sleep-On-LAN</a> tool. Sleep-On-LAN (SOL) is an external tool/daemon that operates on the PCs you want to put to sleep, providing a REST endpoint. For instructions on setting up Sleep-On-LAN, please refer to the <a href="https://github.com/SR-G/sleep-on-lan#usage" class="link" target="_blank">Usage</a> section.
 		 */
-		sol_desc1: () => LocalizedString
+		sol_desc1: () => LocalizedString;
 		/**
 		 * SOL is configured to send requests over HTTP instead of UDP to enable authorization and make requests more reliable.
 		 */
-		sol_desc2: () => LocalizedString
+		sol_desc2: () => LocalizedString;
 		/**
 		 * Therefore, please ensure that you include <span class="badge">HTTP:&lt;YOURPORT&gt;</span> in the <span class="badge">Listeners</span> section of the <a href="https://github.com/SR-G/sleep-on-lan#configuration" class="link" target="_blank">SOL configuration</a>.
 		 */
-		sol_desc3: () => LocalizedString
+		sol_desc3: () => LocalizedString;
 		/**
 		 * Enable Sleep-On-LAN
 		 */
-		sol_enable: () => LocalizedString
+		sol_enable: () => LocalizedString;
 		/**
 		 * SOL Port
 		 */
-		sol_port: () => LocalizedString
+		sol_port: () => LocalizedString;
 		/**
 		 * Authorization
 		 */
-		sol_authorization: () => LocalizedString
+		sol_authorization: () => LocalizedString;
 		/**
 		 * SOL User
 		 */
-		sol_user: () => LocalizedString
+		sol_user: () => LocalizedString;
 		/**
 		 * SOL Password
 		 */
-		sol_password: () => LocalizedString
+		sol_password: () => LocalizedString;
 		/**
 		 * Shutdown
 		 */
-		shutdown: () => LocalizedString
+		shutdown: () => LocalizedString;
 		/**
 		 * This <strong>shell command</strong> will run inside your container (if you use docker) or on your host (if you use the binary). To verify that it works, you can run the command inside the container or on your host shell first. Common commands are <span class="badge">net rpc</span> for windows, <span class="badge">sshpass</span> for linux or <span class="badge">curl</span> in general to make web requests.
 		 */
-		shutdown_desc: () => LocalizedString
+		shutdown_desc: () => LocalizedString;
 		/**
 		 * Examples:
 		 */
-		shutdown_examples: () => LocalizedString
+		shutdown_examples: () => LocalizedString;
 		/**
 		 * Shutdown remote windows machine:
 		 */
-		shutdown_examples_windows: () => LocalizedString
+		shutdown_examples_windows: () => LocalizedString;
 		/**
 		 * Shutdown remote linux machine:
 		 */
-		shutdown_examples_linux: () => LocalizedString
+		shutdown_examples_linux: () => LocalizedString;
 		/**
 		 * Shutdown command
 		 */
-		shutdown_cmd: () => LocalizedString
+		shutdown_cmd: () => LocalizedString;
 		/**
 		 * Just like setting a cron to wake the device, you can also schedule a cron job to shut down this device.
 		 */
-		shutdown_cron_desc: () => LocalizedString
+		shutdown_cron_desc: () => LocalizedString;
 		/**
 		 * Shutdown cron
 		 */
-		shutdown_cron: () => LocalizedString
+		shutdown_cron: () => LocalizedString;
 		/**
 		 * Enable shutdown cron
 		 */
-		shutdown_cron_enable: () => LocalizedString
+		shutdown_cron_enable: () => LocalizedString;
 		/**
 		 * Password
 		 */
-		password: () => LocalizedString
+		password: () => LocalizedString;
 		/**
 		 * Some network cards have the option to set a password for magic packets, also called <span class="badge">SecureON</span>. Password can only be 0, 4 or 6 characters in length.
 		 */
-		password_desc: () => LocalizedString
+		password_desc: () => LocalizedString;
 		/**
 		 * Groups
 		 */
-		groups: () => LocalizedString
+		groups: () => LocalizedString;
 		/**
 		 * You can add devices to a group to have them sorted by group on the dashboard.
 		 */
-		groups_desc: () => LocalizedString
+		groups_desc: () => LocalizedString;
 		/**
 		 * e.g. 'Basement' or 'Office'
 		 */
-		groups_placeholder: () => LocalizedString
+		groups_placeholder: () => LocalizedString;
 		/**
 		 * Scan range saved
 		 */
-		network_scan_range_saved: () => LocalizedString
+		network_scan_range_saved: () => LocalizedString;
 		/**
 		 * Automatically scan your network for devices. For this to work, you need to run UpSnap as root/admin and have nmap installed and available in your $PATH (For docker users, thats already the case and you don't need to do anything). Scanning might take some seconds.
 		 */
-		network_scan_desc: () => LocalizedString
+		network_scan_desc: () => LocalizedString;
 		/**
 		 * IP range
 		 */
-		network_scan_ip_range: () => LocalizedString
+		network_scan_ip_range: () => LocalizedString;
 		/**
 		 * No scan range
 		 */
-		network_scan_no_range: () => LocalizedString
+		network_scan_no_range: () => LocalizedString;
 		/**
 		 * Unsaved changes
 		 */
-		network_scan_unsaved_changes: () => LocalizedString
+		network_scan_unsaved_changes: () => LocalizedString;
 		/**
 		 * Scan running
 		 */
-		network_scan_running: () => LocalizedString
+		network_scan_running: () => LocalizedString;
 		/**
 		 * Scan
 		 */
-		network_scan: () => LocalizedString
+		network_scan: () => LocalizedString;
 		/**
 		 * IP:
 		 */
-		network_scan_ip: () => LocalizedString
+		network_scan_ip: () => LocalizedString;
 		/**
 		 * Mac:
 		 */
-		network_scan_mac: () => LocalizedString
+		network_scan_mac: () => LocalizedString;
 		/**
 		 * Mac vendor:
 		 */
-		network_scan_mac_vendor: () => LocalizedString
+		network_scan_mac_vendor: () => LocalizedString;
 		/**
 		 * Netmask:
 		 */
-		network_scan_netmask: () => LocalizedString
+		network_scan_netmask: () => LocalizedString;
 		/**
 		 * Add all devices
 		 */
-		network_scan_add_all: () => LocalizedString
+		network_scan_add_all: () => LocalizedString;
 		/**
 		 * Replace netmask for all devices?
 		 */
-		network_scan_replace_netmask: () => LocalizedString
+		network_scan_replace_netmask: () => LocalizedString;
 		/**
 		 * New netmask
 		 */
-		network_scan_new_netmask: () => LocalizedString
+		network_scan_new_netmask: () => LocalizedString;
 		/**
 		 * Include devices where name is "Unknown"
 		 */
-		network_scan_include_unknown: () => LocalizedString
+		network_scan_include_unknown: () => LocalizedString;
 		/**
 		 * Require Confirmation
 		 */
-		require_confirmation: () => LocalizedString
-	}
+		require_confirmation: () => LocalizedString;
+	};
 	login: {
 		/**
 		 * Welcome
 		 */
-		welcome: () => LocalizedString
+		welcome: () => LocalizedString;
 		/**
 		 * Email or Username:
 		 */
-		email_label: () => LocalizedString
+		email_label: () => LocalizedString;
 		/**
 		 * Password:
 		 */
-		password_label: () => LocalizedString
+		password_label: () => LocalizedString;
 		/**
 		 * More
 		 */
-		btn_more: () => LocalizedString
+		btn_more: () => LocalizedString;
 		/**
 		 * Other Auth Providers
 		 */
-		menu_title_auth_providers: () => LocalizedString
+		menu_title_auth_providers: () => LocalizedString;
 		/**
 		 * Login
 		 */
-		btn_login: () => LocalizedString
-	}
+		btn_login: () => LocalizedString;
+	};
 	settings: {
 		/**
 		 * Settings
 		 */
-		page_title: () => LocalizedString
+		page_title: () => LocalizedString;
 		/**
 		 * Ping interval
 		 */
-		ping_interval_title: () => LocalizedString
+		ping_interval_title: () => LocalizedString;
 		/**
 		 * Sets the interval in which the devices are pinged. Leave blank to use default value of <span class="badge">@every 3s</span>.
 		 */
-		ping_interval_desc1: () => LocalizedString
+		ping_interval_desc1: () => LocalizedString;
 		/**
 		 * Learn more about the correct syntax for cron on <a class="link" href="https://en.wikipedia.org/wiki/Cron" target="_blank">Wikipedia</a> or refer to the <a class="link" href="https://pkg.go.dev/github.com/robfig/cron/v3" target="_blank">package documentation</a>.
 		 */
-		ping_interval_desc2: () => LocalizedString
+		ping_interval_desc2: () => LocalizedString;
 		/**
 		 * Lazy ping
 		 */
-		lazy_ping_title: () => LocalizedString
+		lazy_ping_title: () => LocalizedString;
 		/**
 		 * When lazy ping is turned on, UpSnap will only ping devices if there is an active user visiting the website. If it's turned off, UpSnap will always ping devices.
 		 */
-		lazy_ping_desc: () => LocalizedString
+		lazy_ping_desc: () => LocalizedString;
 		/**
 		 * Enable
 		 */
-		lazy_ping_enable: () => LocalizedString
+		lazy_ping_enable: () => LocalizedString;
 		/**
 		 * Website title
 		 */
-		website_title_title: () => LocalizedString
+		website_title_title: () => LocalizedString;
 		/**
 		 * Sets the title of the website and in the browser tab.
 		 */
-		website_title_desc: () => LocalizedString
+		website_title_desc: () => LocalizedString;
 		/**
 		 * Icon
 		 */
-		icon_title: () => LocalizedString
+		icon_title: () => LocalizedString;
 		/**
 		 * Set a custom favicon. Supported file types are:
 		 */
-		icon_desc: () => LocalizedString
+		icon_desc: () => LocalizedString;
 		/**
 		 * UpSnap version
 		 */
-		upsnap_version: () => LocalizedString
-	}
+		upsnap_version: () => LocalizedString;
+	};
 	users: {
 		/**
 		 * Users
 		 */
-		page_title: () => LocalizedString
+		page_title: () => LocalizedString;
 		/**
 		 * Allow {username} to create new devices and edit device groups
 		 */
-		allow_create_devices: (arg: { username: unknown }) => LocalizedString
+		allow_create_devices: (arg: { username: unknown }) => LocalizedString;
 		/**
 		 * Device permissions
 		 */
-		device_permissions: () => LocalizedString
+		device_permissions: () => LocalizedString;
 		/**
 		 * Create new device
 		 */
-		create_new_device: () => LocalizedString
+		create_new_device: () => LocalizedString;
 		/**
 		 * Read
 		 */
-		read: () => LocalizedString
+		read: () => LocalizedString;
 		/**
 		 * Update
 		 */
-		update: () => LocalizedString
+		update: () => LocalizedString;
 		/**
 		 * Delete
 		 */
-		'delete': () => LocalizedString
+		delete: () => LocalizedString;
 		/**
 		 * Power
 		 */
-		power: () => LocalizedString
+		power: () => LocalizedString;
 		/**
 		 * Toggle
 		 */
-		toggle: () => LocalizedString
+		toggle: () => LocalizedString;
 		/**
 		 * Confirm delete
 		 */
-		confirm_delete_title: () => LocalizedString
+		confirm_delete_title: () => LocalizedString;
 		/**
 		 * Are you sure you want to delete {username}?
 		 */
-		confirm_delete_desc: (arg: { username: unknown }) => LocalizedString
+		confirm_delete_desc: (arg: { username: unknown }) => LocalizedString;
 		/**
 		 * Create new user
 		 */
-		create_new_user: () => LocalizedString
+		create_new_user: () => LocalizedString;
 		/**
 		 * Username
 		 */
-		username: () => LocalizedString
+		username: () => LocalizedString;
 		/**
 		 * Password
 		 */
-		password: () => LocalizedString
+		password: () => LocalizedString;
 		/**
 		 * Password confirm
 		 */
-		password_confirm: () => LocalizedString
+		password_confirm: () => LocalizedString;
 		/**
 		 * required field
 		 */
-		required_field: () => LocalizedString
-	}
+		required_field: () => LocalizedString;
+	};
 	buttons: {
 		/**
 		 * Save
 		 */
-		save: () => LocalizedString
+		save: () => LocalizedString;
 		/**
 		 * Delete
 		 */
-		'delete': () => LocalizedString
+		delete: () => LocalizedString;
 		/**
 		 * Change
 		 */
-		change: () => LocalizedString
+		change: () => LocalizedString;
 		/**
 		 * Reset
 		 */
-		reset: () => LocalizedString
+		reset: () => LocalizedString;
 		/**
 		 * Cancel
 		 */
-		cancel: () => LocalizedString
+		cancel: () => LocalizedString;
 		/**
 		 * Add
 		 */
-		add: () => LocalizedString
+		add: () => LocalizedString;
 		/**
 		 * Confirm
 		 */
-		confirm: () => LocalizedString
-	}
+		confirm: () => LocalizedString;
+	};
 	welcome: {
 		/**
 		 * Welcome to UpSnap 🥳
 		 */
-		step1_page_title: () => LocalizedString
+		step1_page_title: () => LocalizedString;
 		/**
 		 * Please complete the following steps to finish the setup.
 		 */
-		step1_setup_desc: () => LocalizedString
+		step1_setup_desc: () => LocalizedString;
 		/**
 		 * Next
 		 */
-		step1_setup_btn_next: () => LocalizedString
+		step1_setup_btn_next: () => LocalizedString;
 		/**
 		 * Create an admin account
 		 */
-		step2_page_title: () => LocalizedString
+		step2_page_title: () => LocalizedString;
 		/**
 		 * Email:
 		 */
-		step2_label_email: () => LocalizedString
+		step2_label_email: () => LocalizedString;
 		/**
 		 * Password:
 		 */
-		step2_label_password: () => LocalizedString
+		step2_label_password: () => LocalizedString;
 		/**
 		 * min. 10 characters
 		 */
-		step2_label_min_chars: () => LocalizedString
+		step2_label_min_chars: () => LocalizedString;
 		/**
 		 * Password confirm:
 		 */
-		step2_label_password_confirm: () => LocalizedString
+		step2_label_password_confirm: () => LocalizedString;
 		/**
 		 * Create
 		 */
-		step2_btn_create: () => LocalizedString
+		step2_btn_create: () => LocalizedString;
 		/**
 		 * You are all set! 🎉
 		 */
-		step3_page_title: () => LocalizedString
+		step3_page_title: () => LocalizedString;
 		/**
 		 * Go ahead and add some devices to your dashboard.
 		 */
-		step3_page_desc: () => LocalizedString
+		step3_page_desc: () => LocalizedString;
 		/**
 		 * Lets go!
 		 */
-		step3_btn_done: () => LocalizedString
+		step3_btn_done: () => LocalizedString;
 		/**
 		 * I didn't expect you here! 🧐
 		 */
-		not_expected_title: () => LocalizedString
+		not_expected_title: () => LocalizedString;
 		/**
 		 * You are already done with the setup! Nothing to do.
 		 */
-		not_expected_desc: () => LocalizedString
+		not_expected_desc: () => LocalizedString;
 		/**
 		 * Take me back
 		 */
-		not_expected_back: () => LocalizedString
+		not_expected_back: () => LocalizedString;
 		/**
 		 * Welcome
 		 */
-		progress_step1: () => LocalizedString
+		progress_step1: () => LocalizedString;
 		/**
 		 * Create account
 		 */
-		progress_step2: () => LocalizedString
+		progress_step2: () => LocalizedString;
 		/**
 		 * Done
 		 */
-		progress_step3: () => LocalizedString
-	}
+		progress_step3: () => LocalizedString;
+	};
 	toasts: {
 		/**
 		 * Admin saved
 		 */
-		admin_saved: () => LocalizedString
+		admin_saved: () => LocalizedString;
 		/**
 		 * User saved
 		 */
-		user_saved: () => LocalizedString
+		user_saved: () => LocalizedString;
 		/**
 		 * User {username} created
 		 */
-		user_created: (arg: { username: unknown }) => LocalizedString
+		user_created: (arg: { username: unknown }) => LocalizedString;
 		/**
 		 * User {username} deleted
 		 */
-		user_deleted: (arg: { username: unknown }) => LocalizedString
+		user_deleted: (arg: { username: unknown }) => LocalizedString;
 		/**
 		 * Saved settings
 		 */
-		settings_saved: () => LocalizedString
+		settings_saved: () => LocalizedString;
 		/**
 		 * Password changed. Please login again.
 		 */
-		password_changed: () => LocalizedString
+		password_changed: () => LocalizedString;
 		/**
 		 * Passwords don't match
 		 */
-		passwords_missmatch: () => LocalizedString
+		passwords_missmatch: () => LocalizedString;
 		/**
 		 * Permissions for {username} created
 		 */
-		permissions_created: (arg: { username: unknown }) => LocalizedString
+		permissions_created: (arg: { username: unknown }) => LocalizedString;
 		/**
 		 * Permissions for {username} deleted
 		 */
-		permissions_deleted: (arg: { username: unknown }) => LocalizedString
+		permissions_deleted: (arg: { username: unknown }) => LocalizedString;
 		/**
 		 * Permissions for {username} updated
 		 */
-		permissions_updated: (arg: { username: unknown }) => LocalizedString
+		permissions_updated: (arg: { username: unknown }) => LocalizedString;
 		/**
 		 * Your permissions have been updated
 		 */
-		permissions_updated_personal: () => LocalizedString
+		permissions_updated_personal: () => LocalizedString;
 		/**
 		 * You don't have permission to visit {url}
 		 */
-		no_permission: (arg: { url: unknown }) => LocalizedString
+		no_permission: (arg: { url: unknown }) => LocalizedString;
 		/**
 		 * Created {device}
 		 */
-		device_created: (arg: { device: unknown }) => LocalizedString
+		device_created: (arg: { device: unknown }) => LocalizedString;
 		/**
 		 * Created {count|int} devices
 		 */
-		devices_created_multiple: (arg: { count: unknown }) => LocalizedString
+		devices_created_multiple: (arg: { count: unknown }) => LocalizedString;
 		/**
 		 * Updated {device}
 		 */
-		device_updated: (arg: { device: unknown }) => LocalizedString
+		device_updated: (arg: { device: unknown }) => LocalizedString;
 		/**
 		 * Deleted {device}
 		 */
-		device_deleted: (arg: { device: unknown }) => LocalizedString
+		device_deleted: (arg: { device: unknown }) => LocalizedString;
 		/**
 		 * Created group {group}
 		 */
-		group_created: (arg: { group: unknown }) => LocalizedString
+		group_created: (arg: { group: unknown }) => LocalizedString;
 		/**
 		 * Deleted group {group}
 		 */
-		group_deleted: (arg: { group: unknown }) => LocalizedString
-	}
+		group_deleted: (arg: { group: unknown }) => LocalizedString;
+	};
 	navbar: {
 		/**
 		 * Theme
 		 */
-		theme: () => LocalizedString
+		theme: () => LocalizedString;
 		/**
 		 * New
 		 */
-		'new': () => LocalizedString
+		new: () => LocalizedString;
 		/**
 		 * Edit account
 		 */
-		edit_account: () => LocalizedString
+		edit_account: () => LocalizedString;
 		/**
 		 * Logout
 		 */
-		logout: () => LocalizedString
-	}
-}
+		logout: () => LocalizedString;
+	};
+};
 
 export type Formatters = {
-	int: (value: unknown) => unknown
-}
+	int: (value: unknown) => unknown;
+};
diff --git a/frontend/src/lib/i18n/i18n-util.async.ts b/frontend/src/lib/i18n/i18n-util.async.ts
index c60c1db0..5b1d227b 100644
--- a/frontend/src/lib/i18n/i18n-util.async.ts
+++ b/frontend/src/lib/i18n/i18n-util.async.ts
@@ -1,4 +1,5 @@
 // This file was auto-generated by 'typesafe-i18n'. Any manual changes will be overwritten.
+ 
 
 import { initFormatters } from './formatters';
 import type { Locales, Translations } from './i18n-types';
diff --git a/frontend/src/lib/i18n/i18n-util.sync.ts b/frontend/src/lib/i18n/i18n-util.sync.ts
index e28de4c6..e91d7000 100644
--- a/frontend/src/lib/i18n/i18n-util.sync.ts
+++ b/frontend/src/lib/i18n/i18n-util.sync.ts
@@ -1,4 +1,5 @@
 // This file was auto-generated by 'typesafe-i18n'. Any manual changes will be overwritten.
+ 
 
 import { initFormatters } from './formatters';
 import type { Locales, Translations } from './i18n-types';
diff --git a/frontend/src/lib/i18n/i18n-util.ts b/frontend/src/lib/i18n/i18n-util.ts
index 6f2397ed..a6652a68 100644
--- a/frontend/src/lib/i18n/i18n-util.ts
+++ b/frontend/src/lib/i18n/i18n-util.ts
@@ -1,4 +1,5 @@
 // This file was auto-generated by 'typesafe-i18n'. Any manual changes will be overwritten.
+ 
 
 import {
 	i18n as initI18n,
diff --git a/frontend/src/lib/i18n/it/index.ts b/frontend/src/lib/i18n/it/index.ts
index 6372f994..c36f28ae 100644
--- a/frontend/src/lib/i18n/it/index.ts
+++ b/frontend/src/lib/i18n/it/index.ts
@@ -51,7 +51,6 @@ const it = {
 		modal_confirm_shutdown_desc: 'Sicuro di voler spegnere {device}.',
 		general: 'Generale',
 		general_name: 'Nome',
-		general_name_placeholder: 'Nome dispositivo',
 		general_ip: 'IP',
 		general_mac: 'Mac',
 		general_netmask: 'Maschera di rete',
diff --git a/frontend/src/lib/i18n/ja/index.ts b/frontend/src/lib/i18n/ja/index.ts
index c29f2955..411301fb 100644
--- a/frontend/src/lib/i18n/ja/index.ts
+++ b/frontend/src/lib/i18n/ja/index.ts
@@ -49,7 +49,6 @@ const ja = {
 		modal_confirm_shutdown_desc: '{device} をシャットダウンすることを確認してください。',
 		general: '一般',
 		general_name: '名前',
-		general_name_placeholder: 'デバイス名',
 		general_ip: 'IP',
 		general_mac: 'Mac',
 		general_netmask: 'ネットマスク',
diff --git a/frontend/src/lib/i18n/nl/index.ts b/frontend/src/lib/i18n/nl/index.ts
index 6d616409..51829425 100644
--- a/frontend/src/lib/i18n/nl/index.ts
+++ b/frontend/src/lib/i18n/nl/index.ts
@@ -51,7 +51,6 @@ const nl = {
 		modal_confirm_shutdown_desc: 'Bevestig om {device} af te sluiten.',
 		general: 'Algemeen',
 		general_name: 'Naam',
-		general_name_placeholder: 'Apparaatnaam',
 		general_ip: 'IP',
 		general_mac: 'Mac',
 		general_netmask: 'Subnetmask',
diff --git a/frontend/src/lib/i18n/pt/index.ts b/frontend/src/lib/i18n/pt/index.ts
index 195321ae..992e18ad 100644
--- a/frontend/src/lib/i18n/pt/index.ts
+++ b/frontend/src/lib/i18n/pt/index.ts
@@ -51,7 +51,6 @@ const pt = {
 		modal_confirm_shutdown_desc: 'Confirme o encerramento do {device}.',
 		general: 'Geral',
 		general_name: 'Nome',
-		general_name_placeholder: 'Nome do dispositivo',
 		general_ip: 'IP',
 		general_mac: 'Mac',
 		general_netmask: 'Máscara de rede',
diff --git a/frontend/src/lib/i18n/zh-TW/index.ts b/frontend/src/lib/i18n/zh-TW/index.ts
index 15347643..49453fa4 100644
--- a/frontend/src/lib/i18n/zh-TW/index.ts
+++ b/frontend/src/lib/i18n/zh-TW/index.ts
@@ -50,7 +50,6 @@ const zh_TW = {
 		modal_confirm_shutdown_desc: '你確定要關閉 {device} 嗎?',
 		general: '通用',
 		general_name: '名稱',
-		general_name_placeholder: '裝置名稱',
 		general_ip: 'IP',
 		general_mac: 'Mac',
 		general_netmask: '子網域遮罩',
diff --git a/frontend/src/lib/i18n/zh/index.ts b/frontend/src/lib/i18n/zh/index.ts
index fb8f3bdf..683663fc 100644
--- a/frontend/src/lib/i18n/zh/index.ts
+++ b/frontend/src/lib/i18n/zh/index.ts
@@ -48,7 +48,6 @@ const zh = {
 		modal_confirm_shutdown_desc: '您确定要关闭 {device} 吗?',
 		general: '通用',
 		general_name: '名称',
-		general_name_placeholder: '设备名',
 		general_ip: 'IP',
 		general_mac: 'Mac',
 		general_netmask: '子网掩码',
diff --git a/frontend/src/routes/account/+page.svelte b/frontend/src/routes/account/+page.svelte
index 152f7d79..8009a1f3 100644
--- a/frontend/src/routes/account/+page.svelte
+++ b/frontend/src/routes/account/+page.svelte
@@ -195,7 +195,7 @@
 				{/each}
 			</div>
 			<h2 class="card-title mt-4 mb-2">{$LL.account.language_title()}</h2>
-			<select class="select select-bordered w-full max-w-xs" bind:value={selectedLanguage}>
+			<select class="select w-full max-w-xs" bind:value={selectedLanguage}>
 				<option value="auto" selected={localStorageLang === null}
 					>🌐 {$LL.account.language_option_auto()}</option
 				>
@@ -219,16 +219,16 @@
 		<h2 class="card-title">{$LL.account.change_password_title()}</h2>
 		<p>{$LL.account.change_password_body()}</p>
 		<form on:submit|preventDefault={changePassword}>
-			<div class="form-control w-full max-w-xs">
+			<div class="w-full max-w-xs">
 				{#if !$pocketbase.authStore.isSuperuser}
 					<label class="label" for="password-old">
-						<span class="label-text">{$LL.account.change_password_label()}</span>
+						<span>{$LL.account.change_password_label()}</span>
 					</label>
 					<input
 						id="password-old"
 						type="password"
 						placeholder={$LL.account.change_password_label()}
-						class="input input-bordered w-full max-w-xs"
+						class="input w-full max-w-xs"
 						minlength="5"
 						maxlength="72"
 						bind:value={newPassword.old}
@@ -236,28 +236,28 @@
 					/>
 				{/if}
 				<label class="label" for="password-new">
-					<span class="label-text">{$LL.account.change_password_new()}</span>
+					<span>{$LL.account.change_password_new()}</span>
 				</label>
 				<input
 					id="password-new"
 					type="password"
 					placeholder={$LL.account.change_password_new()}
-					class="input input-bordered w-full max-w-xs"
+					class="input w-full max-w-xs"
 					minlength={$pocketbase.authStore.isSuperuser ? 10 : 5}
 					maxlength="72"
 					bind:value={newPassword.password}
 					required
 				/>
 			</div>
-			<div class="form-control w-full max-w-xs">
+			<div class="w-full max-w-xs">
 				<label class="label" for="password-confirm">
-					<span class="label-text">{$LL.account.change_password_confirm()}</span>
+					<span>{$LL.account.change_password_confirm()}</span>
 				</label>
 				<input
 					id="password-confirm"
 					type="password"
 					placeholder={$LL.account.change_password_confirm()}
-					class="input input-bordered w-full max-w-xs"
+					class="input w-full max-w-xs"
 					minlength={$pocketbase.authStore.isSuperuser ? 10 : 5}
 					maxlength="72"
 					bind:value={newPassword.confirm}
diff --git a/frontend/src/routes/device/new/+page.svelte b/frontend/src/routes/device/new/+page.svelte
index 10280db9..cdadf782 100644
--- a/frontend/src/routes/device/new/+page.svelte
+++ b/frontend/src/routes/device/new/+page.svelte
@@ -45,11 +45,11 @@
 
 <h1 class="mb-8 text-3xl font-bold">{$LL.device.page_title()}</h1>
 <div class="mb-6 flex justify-center">
-	<ul class="menu menu-horizontal rounded-box bg-base-200">
+	<ul class="menu menu-horizontal rounded-box bg-base-200 gap-1">
 		{#each tabs as tab}
 			{#if tab.show}
 				<li>
-					<button class:active={activeTab === tab.name} on:click={() => (activeTab = tab.name)}
+					<button class:menu-active={activeTab === tab.name} on:click={() => (activeTab = tab.name)}
 						>{tab.ll_name} <Fa icon={tab.icon} class="ms-2" /></button
 					>
 				</li>
diff --git a/frontend/src/routes/login/+page.svelte b/frontend/src/routes/login/+page.svelte
index 1bd05883..c6ad557c 100644
--- a/frontend/src/routes/login/+page.svelte
+++ b/frontend/src/routes/login/+page.svelte
@@ -73,19 +73,13 @@
 				</figure>
 				<h2 class="card-title">{$LL.login.welcome()}</h2>
 			</div>
-			<form class="form-control w-full" on:submit|preventDefault={tryAdminThenUser}>
+			<form class="w-full" on:submit|preventDefault={tryAdminThenUser}>
 				<label class="label" for="email">
-					<span class="label-text">{$LL.login.email_label()}</span>
+					<span>{$LL.login.email_label()}</span>
 				</label>
-				<input
-					id="email"
-					type="text"
-					class="input input-bordered w-full"
-					required
-					bind:value={form.email}
-				/>
+				<input id="email" type="text" class="input w-full" required bind:value={form.email} />
 				<label class="label" for="password">
-					<span class="label-text">{$LL.login.password_label()}</span>
+					<span>{$LL.login.password_label()}</span>
 				</label>
 				<label class="relative block">
 					<div
@@ -99,7 +93,7 @@
 					<input
 						id="password"
 						type="password"
-						class="input input-bordered w-full"
+						class="input w-full"
 						maxlength="72"
 						required
 						bind:value={form.password}
diff --git a/frontend/src/routes/settings/+page.svelte b/frontend/src/routes/settings/+page.svelte
index d8ff12c0..e9fc0990 100644
--- a/frontend/src/routes/settings/+page.svelte
+++ b/frontend/src/routes/settings/+page.svelte
@@ -106,11 +106,11 @@
 					<!-- eslint-disable svelte/no-at-html-tags -->
 					{@html $LL.settings.ping_interval_desc2()}
 				</p>
-				<div class="form-control mt-2 w-full">
+				<div class="mt-2 w-full">
 					<input
 						type="text"
 						placeholder="e.g. '@every 5s' or '@every 1m'"
-						class="input w-full max-w-xs"
+						class="input"
 						bind:value={settingsPrivClone.interval}
 					/>
 				</div>
@@ -118,10 +118,10 @@
 				<p class="mt-2">
 					{$LL.settings.lazy_ping_desc()}
 				</p>
-				<div class="form-control w-fit">
+				<div class="w-fit">
 					<label class="label cursor-pointer gap-2">
 						<input type="checkbox" class="checkbox" bind:checked={settingsPrivClone.lazy_ping} />
-						<span class="label-text">{$LL.settings.lazy_ping_enable()}</span>
+						<span>{$LL.settings.lazy_ping_enable()}</span>
 					</label>
 				</div>
 			</div>
@@ -130,11 +130,11 @@
 			<div class="card-body">
 				<h2 class="card-title">{$LL.settings.website_title_title()}</h2>
 				<p class="my-2">{$LL.settings.website_title_desc()}</p>
-				<div class="form-control w-full">
+				<div class="w-full">
 					<input
 						type="text"
 						placeholder="e.g. 'UpSnap'"
-						class="input w-full max-w-xs"
+						class="input"
 						bind:value={settingsPubClone.website_title}
 					/>
 				</div>
@@ -159,10 +159,10 @@
 						bind:this={faviconPreview}
 					/>
 				</div>
-				<div class="form-control flex w-full max-w-md flex-row gap-4">
+				<div class="flex w-full max-w-md flex-row gap-4">
 					<input
 						type="file"
-						class="file-input w-full max-w-xs"
+						class="file-input"
 						accept=".ico,.png,.svg,.gif,.jpg,.jpeg"
 						bind:this={faviconInputElement}
 					/>
diff --git a/frontend/src/routes/users/+page.svelte b/frontend/src/routes/users/+page.svelte
index 472c5127..8f8e3afe 100644
--- a/frontend/src/routes/users/+page.svelte
+++ b/frontend/src/routes/users/+page.svelte
@@ -195,7 +195,7 @@
 						{user.username}
 					</h2>
 					{#each permissions.filter((perm) => perm.user === user.id) as permission}
-						<div class="form-control w-fit">
+						<div class="w-fit">
 							<label class="label cursor-pointer gap-2 text-wrap">
 								<input type="checkbox" bind:checked={permission.create} class="checkbox" />
 								{$LL.users.allow_create_devices({ username: user.username })}
@@ -316,16 +316,18 @@
 			</div>
 		</form>
 		<dialog class="modal" bind:this={deleteModal[index]}>
-			<form method="dialog" class="modal-box">
+			<div class="modal-box">
 				<h3 class="text-lg font-bold">{$LL.users.confirm_delete_title()}</h3>
 				<p class="py-4">{$LL.users.confirm_delete_desc({ username: user.username })}</p>
 				<div class="modal-action">
-					<button class="btn">{$LL.buttons.cancel()}</button>
-					<button class="btn btn-error" on:click={() => deleteUser(user)}
-						>{$LL.buttons.delete()}</button
-					>
+					<form method="dialog">
+						<button class="btn">{$LL.buttons.cancel()}</button>
+						<button class="btn btn-error" on:click={() => deleteUser(user)}
+							>{$LL.buttons.delete()}</button
+						>
+					</form>
 				</div>
-			</form>
+			</div>
 		</dialog>
 	{/each}
 	<div class="card bg-base-200 mt-6 w-full shadow-sm">
@@ -333,9 +335,9 @@
 			<h2 class="card-title">{$LL.users.create_new_user()}</h2>
 			<form on:submit|preventDefault={createUser}>
 				<div class="flex flex-row flex-wrap gap-4">
-					<div class="form-control w-full max-w-xs">
+					<div class="w-full max-w-xs">
 						<label class="label" for="username">
-							<div class="label-text">
+							<div>
 								<span>{$LL.users.username()}</span>
 								<span class="text-error">*</span>
 							</div>
@@ -344,14 +346,14 @@
 							id="username"
 							type="text"
 							placeholder={$LL.users.username()}
-							class="input input-bordered w-full max-w-xs"
+							class="input w-full max-w-xs"
 							required
 							bind:value={newUser.username}
 						/>
 					</div>
-					<div class="form-control w-full max-w-xs">
+					<div class="w-full max-w-xs">
 						<label class="label" for="password">
-							<div class="label-text">
+							<div>
 								<span>{$LL.users.password()}</span>
 								<span class="text-error">*</span>
 							</div>
@@ -360,16 +362,16 @@
 							id="password"
 							type="password"
 							placeholder={$LL.users.password()}
-							class="input input-bordered w-full max-w-xs"
+							class="input w-full max-w-xs"
 							minlength="5"
 							maxlength="72"
 							required
 							bind:value={newUser.password}
 						/>
 					</div>
-					<div class="form-control w-full max-w-xs">
+					<div class="w-full max-w-xs">
 						<label class="label" for="passwordConfirm">
-							<div class="label-text">
+							<div>
 								<span>{$LL.users.password_confirm()}</span>
 								<span class="text-error">*</span>
 							</div>
@@ -378,7 +380,7 @@
 							id="passwordConfirm"
 							type="password"
 							placeholder={$LL.users.password_confirm()}
-							class="input input-bordered w-full max-w-xs"
+							class="input w-full max-w-xs"
 							minlength="5"
 							maxlength="72"
 							required
diff --git a/frontend/src/routes/welcome/+page.svelte b/frontend/src/routes/welcome/+page.svelte
index f4975c1d..95480e4e 100644
--- a/frontend/src/routes/welcome/+page.svelte
+++ b/frontend/src/routes/welcome/+page.svelte
@@ -98,20 +98,14 @@
 						<figure class="w-16"><img src="/gopher.svg" alt="Gopher" /></figure>
 						<h2 class="card-title">{$LL.welcome.step2_page_title()}</h2>
 					</div>
-					<form class="form-control w-full" on:submit|preventDefault={register}>
+					<form class="w-full" on:submit|preventDefault={register}>
 						<label class="label" for="email">
-							<span class="label-text">{$LL.welcome.step2_label_email()}</span>
+							<span>{$LL.welcome.step2_label_email()}</span>
 						</label>
-						<input
-							id="email"
-							type="email"
-							class="input input-bordered w-full"
-							required
-							bind:value={form.email}
-						/>
+						<input id="email" type="email" class="input w-full" required bind:value={form.email} />
 						<label class="label" for="password">
-							<span class="label-text">{$LL.welcome.step2_label_password()}</span>
-							<span class="label-text-alt">{$LL.welcome.step2_label_min_chars()}</span>
+							<span>{$LL.welcome.step2_label_password()}</span>
+							<span>{$LL.welcome.step2_label_min_chars()}</span>
 						</label>
 						<label class="relative block">
 							<div
@@ -125,7 +119,7 @@
 							<input
 								id="password"
 								type="password"
-								class="input input-bordered w-full"
+								class="input w-full"
 								minlength="10"
 								maxlength="72"
 								required
@@ -134,7 +128,7 @@
 							/>
 						</label>
 						<label class="label" for="passwordConfirm">
-							<span class="label-text">{$LL.welcome.step2_label_password_confirm()}</span>
+							<span>{$LL.welcome.step2_label_password_confirm()}</span>
 						</label>
 						<label class="relative block">
 							<div
@@ -148,7 +142,7 @@
 							<input
 								id="confirm"
 								type="password"
-								class="input input-bordered w-full"
+								class="input w-full"
 								minlength="10"
 								maxlength="72"
 								required