fix: normalized and centralized sizes and padding

This commit is contained in:
Robert Janus 2025-05-14 10:58:19 +02:00
parent 38cd37cf74
commit e591c276f5
11 changed files with 108 additions and 101 deletions

View file

@ -1,8 +1,8 @@
.TextField {
--border-color: var(--color-light);
--label-color: var(--color-middle);
--label-position-top: 0.4em;
--label-font-size: 1rem;
--label-position-top: var(--font-size-normal);
--label-font-size: var(--font-size-normal);
--icon-color: var(--color-main-dark);
--message-color: var(--color-middle);
@ -17,8 +17,8 @@
&:has(input:not(:placeholder-shown)) {
--icon-color: var(--color-main-dark);
--label-color: var(--color-main-dark);
--label-position-top: -11px;
--label-font-size: 0.8rem;
--label-position-top: calc(-1 * var(--font-size-normal));
--label-font-size: var(--font-size-s);
}
&.error {
@ -31,7 +31,7 @@
& .wrapper {
display: flex;
align-items: center;
padding: 0.1rem 0.5rem;
padding: var(--padding-xxs) var(--padding-s);
border: 1px solid var(--border-color);
border-radius: var(--radius-default);
}
@ -39,11 +39,11 @@
& label {
position: absolute;
background: var(--color-lightest);
padding: 0.2rem;
left: 1.8rem;
padding: var(--padding-xxs) 0;
left: var(--padding-s);
color: var(--label-color);
top: var(--label-position-top);
font-size: var(--label-font-size);
font-size: var(--font-size-normal);
transition: var(--transition-default);
}
@ -53,8 +53,8 @@
& input {
all: unset;
padding: var(--padding-small);
font-size: 1rem;
padding: var(--padding-s);
font-size: var(--font-size-normal);
width: 100%;
flex: 25% 1 0;
color: var(--color-darkest);
@ -62,6 +62,6 @@
& span {
color: var(--message-color);
font-size: 0.6rem;
font-size: var(--font-size-xs);
}
}