src/assets/views/utils/Field.svelte

@@ -141,8 +141,15 @@
 			outline-offset: 0;
 		}
 
-		&:not(.empty), select ~, [type="file"] ~, [type="color"] ~, .focused ~, :focus ~ {
+		&:not(.empty),
-			.sections label {
+        select ~,
+        [type="file"] ~,
+        [type="color"] ~,
+        [type="number"] ~,
+        .focused ~,
+        :focus ~,
+        fieldset {
+			.sections label, legend, .time-input label {
 				top: 8px;
 				font-size: 14px;
 			}
@@ -176,8 +183,8 @@
 			& + :global(.feather) {
 				position: absolute;
 				pointer-events: none;
-				right: 8px;
+				right: 0;
-				top: 30px;
+				top: 0;
 
 				transition: transform 150ms ease-out;
 			}
@@ -223,6 +230,7 @@
 			input,
 			select,
 			select,
+            fieldset,
 			.form-display,
 			.textarea-growing-wrapper,
 			.textarea-growing-wrapper:after,
@@ -321,7 +329,14 @@
 			display: flex;
 			flex-direction: row;
 			align-items: start;
-			margin: 16px auto;
+            width: 100%;
+            margin: 0;
+            padding-top: 8px;
+            border: 0;
+
+			legend {
+				padding: 8px;
+			}
 
 			.time-input {
 				position: relative;
@@ -333,10 +348,6 @@
 				}
 			}
 
-			> :not(.form-field) {
-				padding: 32px 8px 8px 8px;
-			}
-
 			+ {
 				.error, .hint {
 					margin-top: -16px;