fix(ui): improve onboarding page styling to match sign-in page
Add 32px card padding and reduce max-width to 420px for consistency with the sign-in page. Add noValidate to prevent browser-native required validation outlines on inputs. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -8,10 +8,14 @@
|
|||||||
|
|
||||||
.wrapper {
|
.wrapper {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 480px;
|
max-width: 420px;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
padding: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
.inner {
|
.inner {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|||||||
@@ -43,7 +43,7 @@ export function OnboardingPage() {
|
|||||||
return (
|
return (
|
||||||
<div className={styles.page}>
|
<div className={styles.page}>
|
||||||
<div className={styles.wrapper}>
|
<div className={styles.wrapper}>
|
||||||
<Card>
|
<Card className={styles.card}>
|
||||||
<div className={styles.inner}>
|
<div className={styles.inner}>
|
||||||
<div className={styles.logo}>
|
<div className={styles.logo}>
|
||||||
<img src={cameleerLogo} alt="" className={styles.logoImg} />
|
<img src={cameleerLogo} alt="" className={styles.logoImg} />
|
||||||
@@ -59,7 +59,7 @@ export function OnboardingPage() {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<form onSubmit={handleSubmit} className={styles.form}>
|
<form onSubmit={handleSubmit} className={styles.form} noValidate>
|
||||||
<FormField label="Organization name" htmlFor="onboard-name" required>
|
<FormField label="Organization name" htmlFor="onboard-name" required>
|
||||||
<Input
|
<Input
|
||||||
id="onboard-name"
|
id="onboard-name"
|
||||||
|
|||||||
Reference in New Issue
Block a user