update onboarding buttons
This commit is contained in:
parent
aa0bbe1cfc
commit
25e0ec119d
|
@ -1,7 +1,6 @@
|
||||||
import React, { useContext, useEffect, useState } from 'react';
|
import React, { useContext, useEffect, useState } from 'react';
|
||||||
import Carousel from 'react-bootstrap/Carousel';
|
import Carousel from 'react-bootstrap/Carousel';
|
||||||
import Button from 'react-bootstrap/Button';
|
import { styled, Button, Typography, TypographyProps } from '@mui/material';
|
||||||
import { styled, Typography, TypographyProps } from '@mui/material';
|
|
||||||
import { AppContext } from './_app';
|
import { AppContext } from './_app';
|
||||||
import Login from 'components/Login';
|
import Login from 'components/Login';
|
||||||
import { useRouter } from 'next/router';
|
import { useRouter } from 'next/router';
|
||||||
|
@ -56,9 +55,12 @@ const MobileBox = styled('div')`
|
||||||
display: none;
|
display: none;
|
||||||
|
|
||||||
@media (max-width: 1024px) {
|
@media (max-width: 1024px) {
|
||||||
|
max-width: 375px;
|
||||||
|
width: 100%;
|
||||||
|
padding: 12px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
padding: 40px 10px;
|
gap: 8px;
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
@ -151,6 +153,9 @@ export default function LandingPage() {
|
||||||
const signUp = () => setShowLogin(false);
|
const signUp = () => setShowLogin(false);
|
||||||
const login = () => setShowLogin(true);
|
const login = () => setShowLogin(true);
|
||||||
|
|
||||||
|
const redirectToSignupPage = () => router.push(PAGES.SIGNUP);
|
||||||
|
const redirectToLoginPage = () => router.push(PAGES.LOGIN);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Container>
|
<Container>
|
||||||
{loading ? (
|
{loading ? (
|
||||||
|
@ -203,19 +208,13 @@ export default function LandingPage() {
|
||||||
</SlideContainer>
|
</SlideContainer>
|
||||||
<MobileBox>
|
<MobileBox>
|
||||||
<Button
|
<Button
|
||||||
variant="outline-success"
|
color="accent"
|
||||||
size="lg"
|
size="large"
|
||||||
style={{ padding: '10px 50px' }}
|
onClick={redirectToSignupPage}>
|
||||||
onClick={() => router.push(PAGES.SIGNUP)}>
|
{constants.NEW_USER}
|
||||||
{constants.SIGN_UP}
|
|
||||||
</Button>
|
</Button>
|
||||||
<br />
|
<Button size="large" onClick={redirectToLoginPage}>
|
||||||
<Button
|
{constants.EXISTING_USER}
|
||||||
variant="link"
|
|
||||||
size="lg"
|
|
||||||
style={{ color: '#fff', padding: '10px 50px' }}
|
|
||||||
onClick={() => router.push(PAGES.LOGIN)}>
|
|
||||||
{constants.LOGIN}
|
|
||||||
</Button>
|
</Button>
|
||||||
</MobileBox>
|
</MobileBox>
|
||||||
<DesktopBox>
|
<DesktopBox>
|
||||||
|
|
|
@ -51,6 +51,8 @@ const englishConstants = {
|
||||||
COMPANY_NAME: 'ente',
|
COMPANY_NAME: 'ente',
|
||||||
LOGIN: 'Login',
|
LOGIN: 'Login',
|
||||||
SIGN_UP: 'Signup',
|
SIGN_UP: 'Signup',
|
||||||
|
NEW_USER: 'New to ente',
|
||||||
|
EXISTING_USER: 'Existing user',
|
||||||
NAME: 'Name',
|
NAME: 'Name',
|
||||||
ENTER_NAME: 'Your name',
|
ENTER_NAME: 'Your name',
|
||||||
EMAIL: 'Email',
|
EMAIL: 'Email',
|
||||||
|
|
Loading…
Reference in a new issue