scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: remove placeholders

Browse Source
This commit is contained in:
Christel Westerberg
2024-07-15 15:07:56 +02:00
parent 62310caa90
commit 226d19ce5f
2 changed files with 13 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
components/Forms/Edit/Profile/FormContent/index.tsx
View File

@@ -36,38 +36,27 @@ export default function FormContent() {
</Body> </Body>
</header> </header>
<DateSelect name="dateOfBirth" registerOptions={{ required: true }} /> <DateSelect name="dateOfBirth" registerOptions={{ required: true }} />
<Input <Input label={`${street} 1`} name="address.streetAddress" />
label={`${street} 1`} <Input label={city} name="address.city" />
name="address.streetAddress"
placeholder={street}
/>
<Input label={city} name="address.city" placeholder={city} />
<div className={styles.container}> <div className={styles.container}>
<Input <Input
label={zipCode} label={zipCode}
name="address.zipCode" name="address.zipCode"
placeholder={zipCode}
registerOptions={{ required: true }} registerOptions={{ required: true }}
/> />
<CountrySelect <CountrySelect
label={country} label={country}
name="address.countryCode" name="address.countryCode"
placeholder={country}
registerOptions={{ required: true }} registerOptions={{ required: true }}
/> />
</div> </div>
<Input <Input
label={email} label={email}
name="email" name="email"
placeholder={email}
registerOptions={{ required: true }} registerOptions={{ required: true }}
type="email" type="email"
/> />
<Phone <Phone label={phoneNumber} name="phoneNumber" />
label={phoneNumber}
name="phoneNumber"
placeholder={phoneNumber}
/>
<Select <Select
items={languageSelect} items={languageSelect}
label={formatMessage({ id: "Language" })} label={formatMessage({ id: "Language" })}
@@ -79,17 +68,11 @@ export default function FormContent() {
<header> <header>
<Body textTransform="bold">{formatMessage({ id: "Password" })}</Body> <Body textTransform="bold">{formatMessage({ id: "Password" })}</Body>
</header> </header>
<Input <Input label={password} name="currentPassword" type="password" />
label={password}
name="currentPassword"
placeholder={password}
type="password"
/>
<NewPassword /> <NewPassword />
<Input <Input
label={retypeNewPassword} label={retypeNewPassword}
name="retypeNewPassword" name="retypeNewPassword"
placeholder={retypeNewPassword}
type="password" type="password"
/> />
</section> </section>

16
components/TempDesignSystem/Form/NewPassword/newPassword.module.css
View File

@@ -42,7 +42,9 @@
} }
.input:focus, .input:focus,
.input:focus:placeholder-shown { .input:focus:placeholder-shown,
.input:active,
.input:active:placeholder-shown {
height: 18px; height: 18px;
transition: height 150ms ease; transition: height 150ms ease;
outline: none; outline: none;
@@ -52,15 +54,15 @@
color: var(--Main-Grey-40); color: var(--Main-Grey-40);
} }
.helpText {
align-items: flex-start;
display: flex;
gap: var(--Spacing-x-half);
}
.errors { .errors {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
gap: var(--Spacing-x-one-and-half) var(--Spacing-x1); gap: var(--Spacing-x-one-and-half) var(--Spacing-x1);
padding-top: var(--Spacing-x1); padding-top: var(--Spacing-x1);
} }
.helpText {
align-items: flex-start;
display: flex;
gap: var(--Spacing-x-half);
}