jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

change(ui) - login pages

Browse source
This commit is contained in:
Shekar Siri 2023-03-29 11:48:22 +02:00
parent fd5bfd69e1
commit 01a3574389
2 changed files with 113 additions and 105 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
frontend/app/components/Signup/Signup.js
View file

@ -87,7 +87,7 @@ export default class Signup extends React.Component {
return (
<div className="flex justify-center items-center gap-6" style={{ height: '100vh' }}>
<div className={cn('relative overflow-hidden')}>
{/* <div className={cn('relative overflow-hidden')}>
<div className="text-lg flex items-center" style={{ width: '350px'}}>
<div>
<div className="flex items-end text-3xl font-bold mb-6">
@ -108,7 +108,7 @@ export default class Signup extends React.Component {
</div>
</div>
</div>
</div>
</div> */}
<div className="flex items-center justify-center">
<div className="">
<SignupForm />

214
frontend/app/components/Signup/SignupForm/SignupForm.js
View file

@ -74,120 +74,128 @@ export default class SignupForm extends React.Component {
const { CAPTCHA_ENABLED } = this.state;
return (
<Form onSubmit={this.onSubmit} className="bg-white border rounded">
<div className="mb-8">
<h2 className="text-center text-2xl font-medium mb-6 border-b p-5 w-full">Create Account</h2>
<div className="flex flex-col items-center">
<div className="m-10 ">
<img src="/assets/logo.svg" width={200} />
</div>
<>
{CAPTCHA_ENABLED && (
<ReCAPTCHA
ref={recaptchaRef}
size="invisible"
sitekey={window.env.CAPTCHA_SITE_KEY}
onChange={(token) => this.handleSubmit(token)}
/>
)}
<div className="px-8">
{tenants.length > 0 && (
<Form onSubmit={this.onSubmit} className="bg-white border rounded">
<div className="mb-8">
<h2 className="text-center text-2xl font-medium mb-6 border-b p-5 w-full">
Create Account
</h2>
</div>
<>
{CAPTCHA_ENABLED && (
<ReCAPTCHA
ref={recaptchaRef}
size="invisible"
sitekey={window.env.CAPTCHA_SITE_KEY}
onChange={(token) => this.handleSubmit(token)}
/>
)}
<div className="px-8">
{tenants.length > 0 && (
<Form.Field>
<label>Existing Accounts</label>
<Select
className="w-full"
placeholder="Select account"
selection
options={tenants}
name="tenantId"
// value={ instance.currentPeriod }
onChange={this.writeOption}
/>
</Form.Field>
)}
<Form.Field>
<label>Existing Accounts</label>
<Select
className="w-full"
placeholder="Select account"
selection
options={tenants}
name="tenantId"
// value={ instance.currentPeriod }
onChange={this.writeOption}
<label>Email Address</label>
<Input
autoFocus={true}
autoComplete="username"
type="email"
placeholder="E.g. email@yourcompany.com"
name="email"
onChange={this.write}
required="true"
icon="envelope"
/>
</Form.Field>
)}
<Form.Field>
<label>Email Address</label>
<Input
autoFocus={true}
autoComplete="username"
type="email"
placeholder="E.g. email@yourcompany.com"
name="email"
onChange={this.write}
required="true"
icon="envelope"
/>
</Form.Field>
<Form.Field>
<label className="mb-2">Password</label>
<Input
type="password"
placeholder="Min 8 Characters"
minLength="8"
name="password"
onChange={this.write}
required="true"
icon="key"
/>
</Form.Field>
<Form.Field>
<label>Name</label>
<Input
type="text"
placeholder="E.g John Doe"
name="fullname"
onChange={this.write}
required="true"
icon="user-alt"
/>
</Form.Field>
<Form.Field>
<label>Organization</label>
<Input
type="text"
placeholder="E.g Uber"
name="organizationName"
onChange={this.write}
required="true"
icon="buildings"
/>
</Form.Field>
<Button type="submit" variant="primary" loading={loading} className="w-full">
Create account
</Button>
<div className="my-6">
<div className="text-sm">
By signing up, you agree to our{' '}
<a href="https://openreplay.com/terms.html" className="link">
terms of service
</a>{' '}
and{' '}
<a href="https://openreplay.com/privacy.html" className="link">
privacy policy
</a>
.
<Form.Field>
<label className="mb-2">Password</label>
<Input
type="password"
placeholder="Min 8 Characters"
minLength="8"
name="password"
onChange={this.write}
required="true"
icon="key"
/>
</Form.Field>
<Form.Field>
<label>Name</label>
<Input
type="text"
placeholder="E.g John Doe"
name="fullname"
onChange={this.write}
required="true"
icon="user-alt"
/>
</Form.Field>
<Form.Field>
<label>Organization</label>
<Input
type="text"
placeholder="E.g Uber"
name="organizationName"
onChange={this.write}
required="true"
icon="buildings"
/>
</Form.Field>
<Button type="submit" variant="primary" loading={loading} className="w-full">
Create Account
</Button>
<div className="my-6">
<div className="text-sm">
By signing up, you agree to our{' '}
<a href="https://openreplay.com/terms.html" className="link">
terms of service
</a>{' '}
and{' '}
<a href="https://openreplay.com/privacy.html" className="link">
privacy policy
</a>
.
</div>
</div>
</div>
</div>
</>
{errors && (
<div className={stl.errors}>
{errors.map((error) => (
<div className={stl.errorItem}>
<Icon name="info" color="red" size="20" />
<span className="color-red ml-2">
{error}
<br />
</span>
</div>
))}
</div>
)}
<div className="text-center bg-gray-50 py-4 border-t">
</>
{errors && (
<div className={stl.errors}>
{errors.map((error) => (
<div className={stl.errorItem}>
<Icon name="info" color="red" size="20" />
<span className="color-red ml-2">
{error}
<br />
</span>
</div>
))}
</div>
)}
</Form>
<div className="text-center py-6">
Already having an account?{' '}
<span className="link">
<Link to={LOGIN_ROUTE}>Login</Link>
</span>
</div>
</Form>
</div>
);
}
}