diff --git a/views/devices/put/aspect_ratio_tolerance_input.templ b/views/devices/put/aspect_ratio_tolerance_input.templ
index 59ea880..d120259 100644
--- a/views/devices/put/aspect_ratio_tolerance_input.templ
+++ b/views/devices/put/aspect_ratio_tolerance_input.templ
@@ -21,7 +21,7 @@ templ AspectRatioToleranceInput(data AspectRatioToleranceData) {
 			type="number"
 			min="0"
 			@change="$el.setCustomValidity(''); this.error = false"
-			class="input input-bordered"
+			class="input input-bordered w-full"
 			:class="{'text-error': error, 'input-error': error}"
 			value={ fmt.Sprintf("%.2f", data.Value) }
 			placeholder="0.20"
diff --git a/views/devices/put/max_image_resolution_input.templ b/views/devices/put/max_image_resolution_input.templ
index 8bbfd75..57244a4 100644
--- a/views/devices/put/max_image_resolution_input.templ
+++ b/views/devices/put/max_image_resolution_input.templ
@@ -27,9 +27,8 @@ templ MaxImageResolutionXInput(data ResolutionData) {
 			min="0"
 			@change="$el.setCustomValidity(''); this.error = false"
 			class={ utils.CXX(
-                "input input-bordered", true,
-                "text-error", data.Error != "",
-                "input-error", data.Error != "",
+                "input input-bordered w-full", true,
+                "text-error input-error", data.Error != "",
             ) }
 			:class="{'text-error': error, 'input-error': error}"
 			value={ strconv.Itoa(data.Value) }
@@ -74,9 +73,8 @@ templ MaxImageResolutionYInput(data ResolutionData) {
 			min="0"
 			@change="$el.setCustomValidity(''); this.error = false"
 			class={ utils.CXX(
-                "input input-bordered", true,
-                "text-error", data.Error != "",
-                "input-error", data.Error != "",
+                "input input-bordered w-full", true,
+                "text-error input-error", data.Error != "",
             ) }
 			:class="{'text-error': error, 'input-error': error}"
 			value={ strconv.Itoa(data.Value) }
diff --git a/views/devices/put/min_image_resolution_input.templ b/views/devices/put/min_image_resolution_input.templ
index 15bbbc6..1c97013 100644
--- a/views/devices/put/min_image_resolution_input.templ
+++ b/views/devices/put/min_image_resolution_input.templ
@@ -27,7 +27,7 @@ templ MinImageResolutionXInput(data ResolutionData) {
 			min="0"
 			@change="$el.setCustomValidity(''); this.error = false"
 			class={ utils.CXX(
-                "input input-bordered", true,
+                "input input-bordered w-full", true,
                 "text-error", data.Error != "",
                 "input-error", data.Error != "",
             ) }
@@ -75,7 +75,7 @@ templ MinImageResolutionYInput(data ResolutionData) {
 			min="0"
 			@change="$el.setCustomValidity(''); this.error = false"
 			class={ utils.CXX(
-                "input input-bordered", true,
+                "input input-bordered w-full", true,
                 "text-error", data.Error != "",
                 "input-error", data.Error != "",
             ) }
diff --git a/views/devices/put/name_input.templ b/views/devices/put/name_input.templ
index b2487c1..33189cd 100644
--- a/views/devices/put/name_input.templ
+++ b/views/devices/put/name_input.templ
@@ -10,7 +10,7 @@ type NameInputData struct {
 }
 
 templ NameInput(data NameInputData) {
-	<label id="name-input-form" class={ utils.CXX("form-control", true, "col-span-2", data.EditMode) }>
+	<label id="name-input-form" class={ utils.CXX("form-control", true, "sm:col-span-2", data.EditMode) }>
 		<div class="label">
 			<span
 				class={ utils.CXX("label-text", true, "text-error", data.Error != "") }
@@ -30,7 +30,7 @@ templ NameInput(data NameInputData) {
 			}
 			name="name"
 			type="text"
-			class={ utils.CXX("input input-bordered", true, "input-error", data.Error != "") }
+			class={ utils.CXX("input input-bordered w-full", true, "input-error", data.Error != "", "sm:col-span-2", data.EditMode) }
 			value={ data.Value }
 		/>
 		<div class="label">
diff --git a/views/devices/put/nsfw_checkbox.templ b/views/devices/put/nsfw_checkbox.templ
index eba3063..5002e37 100644
--- a/views/devices/put/nsfw_checkbox.templ
+++ b/views/devices/put/nsfw_checkbox.templ
@@ -11,7 +11,7 @@ type NSFWCheckboxData struct {
 templ NSFWCheckbox(data NSFWCheckboxData) {
 	<div
 		x-data={ fmt.Sprintf(`{checked: %t}`, data.Checked) }
-		class={ utils.CXX("form-control", true, "col-span-2", data.EditMode) }
+		class={ utils.CXX("form-control w-full", true, "sm:col-span-2", data.EditMode) }
 	>
 		<label
 			class="label cursor-pointer border input input-bordered"
diff --git a/views/devices/put/resolution_input.templ b/views/devices/put/resolution_input.templ
index 8dde32e..7aeaac3 100644
--- a/views/devices/put/resolution_input.templ
+++ b/views/devices/put/resolution_input.templ
@@ -33,7 +33,7 @@ templ ResolutionXInput(data ResolutionData) {
 			min="1"
 			@change="$el.setCustomValidity(''); this.error = false"
 			class={ utils.CXX(
-                "input input-bordered", true,
+                "input input-bordered w-full", true,
                 "text-error", data.Error != "",
                 "input-error", data.Error != "",
             ) }
@@ -82,7 +82,7 @@ templ ResolutionYInput(data ResolutionData) {
 			min="1"
 			@change="$el.setCustomValidity(''); this.error = false"
 			class={ utils.CXX(
-                "input input-bordered", true,
+                "input input-bordered w-full", true,
                 "text-error", data.Error != "",
                 "input-error", data.Error != "",
             ) }
diff --git a/views/devices/put/slug_input.templ b/views/devices/put/slug_input.templ
index 74c5a72..f30401b 100644
--- a/views/devices/put/slug_input.templ
+++ b/views/devices/put/slug_input.templ
@@ -35,11 +35,9 @@ templ SlugInput(data SlugInputData) {
 			type="text"
 			@change="$el.setCustomValidity('')"
 			class={ utils.CXX(
-                "input input-bordered", true,
-                "text-error", data.Error != "",
-                "text-success", data.Valid != "",
-                "input-error", data.Error != "",
-                "input-success", data.Valid != "",
+                "input input-bordered w-full", true,
+                "text-error input-error", data.Error != "",
+                "text-success input-success", data.Valid != "",
             ) }
 			hx-get="/htmx/devices/add/validate/slug"
 			hx-trigger="change, input delay:2s"
diff --git a/views/devices/put/view.templ b/views/devices/put/view.templ
index f962e77..f0023e5 100644
--- a/views/devices/put/view.templ
+++ b/views/devices/put/view.templ
@@ -39,10 +39,10 @@ templ Content(c *views.Context, data Data) {
 				method="post"
 				hx-post={ data.PostAction }
 				action={ templ.SafeURL(data.PostAction) }
-				class="grid sm:grid-cols-2 gap-4 sm:gap-y-8"
 				hx-target={ components.NotificationContainerID }
 				hx-target-error={ components.NotificationContainerID }
 				hx-swap="afterbegin"
+				class="grid sm:grid-cols-2 gap-4 sm:gap-y-8"
 			>
 				@NameInput(data.NameInput)
 				if !data.EditMode {
@@ -50,7 +50,7 @@ templ Content(c *views.Context, data Data) {
 				}
 				@ResolutionXInput(data.ResolutionX)
 				@ResolutionYInput(data.ResolutionY)
-				<div class="divider my-auto sm:col-span-2 sm:my-8"><h3 class="m-0 p-0">Filter</h3></div>
+				<div class="divider my-auto sm:my-8 sm:col-span-2"><h3 class="m-0 p-0">Filter</h3></div>
 				@AspectRatioToleranceInput(data.AspectRatioTolerance)
 				@NSFWCheckbox(data.NSFWCheckbox)
 				if !data.EditMode {