From 7d2b088635e39cc2a57ba5379a59f0f8a0838b97 Mon Sep 17 00:00:00 2001 From: Alice Gaudon Date: Mon, 8 Nov 2021 01:44:26 +0100 Subject: [PATCH] Fix no icon fields input and label shift --- src/assets/views/utils/Field.svelte | 24 ++++++++++++++++++++---- 1 file changed, 20 insertions(+), 4 deletions(-) diff --git a/src/assets/views/utils/Field.svelte b/src/assets/views/utils/Field.svelte index d6b40b2..f0a9671 100644 --- a/src/assets/views/utils/Field.svelte +++ b/src/assets/views/utils/Field.svelte @@ -104,7 +104,7 @@ label { position: absolute; z-index: 1; - left: 68px; + left: 8px; top: 22px; user-select: none; font-size: 16px; @@ -116,6 +116,10 @@ cursor: text; } + .has-icon label { + left: 68px; + } + &.disabled { opacity: 0.5; @@ -150,12 +154,24 @@ .textarea-growing-wrapper, .textarea-growing-wrapper:after { display: block; - margin-left: -60px; - padding: 32px 8px 8px 68px; + padding: 32px 8px 8px; width: 100%; height: 60px; } + .has-icon { + input, + select, + select, + textarea, + .form-display, + .textarea-growing-wrapper, + .textarea-growing-wrapper:after { + margin-left: -60px; + padding-left: 68px; + } + } + select { position: relative; -webkit-appearance: none; @@ -345,7 +361,7 @@ class:file={type === 'file'} class:empty={value === ''} class:disabled={Object.keys($$restProps).indexOf('disabled') >= 0}> -
+
{#if icon} {/if}