From 4a99a5acf594b749353d1a3b22858e39178f8e2b Mon Sep 17 00:00:00 2001 From: Alice Gaudon Date: Tue, 9 Nov 2021 18:34:01 +0100 Subject: [PATCH] Fix fieldset and number input display --- src/assets/views/utils/Field.svelte | 29 ++++++++++++++++++++--------- 1 file changed, 20 insertions(+), 9 deletions(-) diff --git a/src/assets/views/utils/Field.svelte b/src/assets/views/utils/Field.svelte index bcb548b..cbf6804 100644 --- a/src/assets/views/utils/Field.svelte +++ b/src/assets/views/utils/Field.svelte @@ -141,8 +141,15 @@ outline-offset: 0; } - &:not(.empty), select ~, [type="file"] ~, [type="color"] ~, .focused ~, :focus ~ { - .sections label { + &:not(.empty), + 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; - top: 30px; + right: 0; + 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;