dan/Portfolio
1
0
Fork 0
mirror of https://github.com/danbulant/Portfolio synced 2026-05-26 13:31:45 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: refactor text field styles

Browse source
This commit is contained in:
EETagent 2022-12-04 12:59:59 +01:00
parent cfbe698e68
commit b8f25caf7e
1 changed files with 11 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
frontend/src/lib/components/textfield/TextField.svelte
View file

@ -10,7 +10,7 @@
export let error: string = ''; export let error: string = '';
</script> </script>
<div class="relative flex items-center justify-center"> <div>
<input <input
class:error class:error
bind:value bind:value
@ -19,12 +19,11 @@
on:keyup on:keyup
on:change on:change
class:withIcon={icon} 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 use:typeAction
{placeholder} {placeholder}
/> />
{#if icon} {#if icon}
<span class="absolute right-0 top-0 bottom-0 my-auto flex bg-transparent p-3"> <span>
<slot name="icon" /> <slot name="icon" />
</span> </span>
{/if} {/if}
@ -35,6 +34,15 @@
input { input {
@apply w-full; @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 { .withIcon {
@apply pr-14; @apply pr-14;
} }