refactor: refactor text field styles

This commit is contained in:
EETagent 2022-12-04 12:59:59 +01:00
parent cfbe698e68
commit b8f25caf7e

View file

@ -10,7 +10,7 @@
export let error: string = '';
</script>
<div class="relative flex items-center justify-center">
<div>
<input
class:error
bind:value
@ -19,12 +19,11 @@
on:keyup
on:change
class:withIcon={icon}
class="hover:border-sspsBlue w-full rounded-lg border border-2 bg-[#f8fafb] p-3 text-xl shadow-lg outline-none transition-colors duration-300"
use:typeAction
{placeholder}
/>
{#if icon}
<span class="absolute right-0 top-0 bottom-0 my-auto flex bg-transparent p-3">
<span>
<slot name="icon" />
</span>
{/if}
@ -35,6 +34,15 @@
input {
@apply w-full;
}
div {
@apply relative flex items-center justify-center;
}
input {
@apply hover:border-sspsBlue w-full rounded-lg border border-2 bg-[#f8fafb] p-3 text-xl shadow-lg outline-none transition-colors duration-300;
}
div span {
@apply absolute right-0 top-0 bottom-0 my-auto flex bg-transparent p-3;
}
.withIcon {
@apply pr-14;
}