...
 
Commits (2)
......@@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="application-name" content="Riot">
<meta name="application-name" content="Riot">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<link rel="apple-touch-icon" sizes="180x180" href="%PUBLIC_URL%/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="%PUBLIC_URL%/favicon-32x32.png">
......@@ -10,7 +10,7 @@
<link rel="mask-icon" href="%PUBLIC_URL%/safari-pinned-tab.svg" color="#7b68ee">
<meta name="msapplication-config" content="%PUBLIC_URL%/browserconfig.xml">
<meta name="msapplication-TileColor" content="#7B68EE">
<meta name="viewport" content="width=device-width, initial-scale=0.9">
<meta name="viewport" content="width=device-width, initial-scale=0.9">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="default">
......
......@@ -5,6 +5,7 @@
text-align: center;
text-decoration: none;
height: 38px;
justify-content: center; //remove this if this has no effect
align-items: center;
font-size: .875rem;
border-radius: 4px;
......
......@@ -59,7 +59,7 @@ export default function Modal(props: ModalProps) {
return (
<div className={modalClasses} onClick={handleClose}>
<Helmet>
<meta name="theme-color" content='#00000' />
<meta name="theme-color" content='#1D1D1E'/>
</Helmet>
<div className={classes}>
<div className={styles.container}>
......
......@@ -61,7 +61,7 @@
font-size: .875rem;
}
input[type=email], input[type=password] {
input[type=text], input[type=email], input[type=password] {
font-family: 'Open Sans', sans-serif;
height: 40px;
color: white;
......@@ -88,11 +88,11 @@
padding: 12px 32px;
margin: 10px 0 10px 0;
font-size: 1rem;
background: mediumslateblue;
background-color: mediumslateblue;
border: none;
border-radius: 4px;
cursor: pointer;
transition: .3s ease;
//transition: background-color .3s ease;
outline: 0;
font-family: 'Open Sans', sans-serif;
border: 1px solid transparent;
......
......@@ -16,9 +16,12 @@ enum ErrorType {
};
export default function Login() {
let [ doRegister, setRegister ] = useState(false);
let [ error, setError ] = useState({ type: ErrorType.NONE, reason: '' });
// Form Inputs
let [ email, setEmail ] = useState('');
let [ password, setPassword ] = useState('');
let [ error, setError ] = useState({ type: ErrorType.NONE, reason: '' });
function submitForm(e: React.FormEvent, setPage: (page: Page) => void) {
e.preventDefault();
......@@ -40,6 +43,11 @@ export default function Login() {
});
}
function toggle(e: React.MouseEvent, target: boolean) {
e.preventDefault();
setRegister(target);
}
let [ tfa, setTFA ] = useState(true);
return (
......@@ -67,17 +75,36 @@ export default function Login() {
</div>
<div className={styles.right}>
<form className={styles.form} onSubmit={ev => submitForm(ev, app.setPage)}>
<div className={styles.welcome}>Welcome back!</div>
{ doRegister ?
<div>
<div className={styles.welcome}>Create an account</div>
<span className={styles.title}>Email</span>
<input type="email" value={email} onChange={e => setEmail(e.target.value)} />
<span className={styles.title}>Desired Username</span>
<input type="text" value={email} onChange={e => setEmail(e.target.value)} />
<span className={styles.title}>Password</span>
<input type="password" value={password} onChange={e => setPassword(e.target.value)} />
<input type="checkbox" value='true'/>
<span className={styles.description}>I agree to Riot's Terms of Service and its Community Guidelines.</span>
<input type="submit" value="Sign up"/>
<span className={styles.signin}>Have an account? <a href="/login" className={styles.link} onClick={e => toggle(e, false)}>Sign in</a></span>
</div>
: <div>
<div className={styles.welcome}>Welcome back!</div>
<span className={styles.title}>Email</span>
<input type="email" value={email} onChange={e => setEmail(e.target.value)} />
<span className={styles.title}>Password</span>
<input type="password" value={password} onChange={e => setPassword(e.target.value)} />
<span className={styles.title}>Email</span>
<input type="email" value={email} onChange={e => setEmail(e.target.value)} />
<span className={styles.title}>Password</span>
<input type="password" value={password} onChange={e => setPassword(e.target.value)} />
<a className={styles.link} href="/forgotidk">Forgot your password?</a>
<input type="submit" value="Log in"/>
<a className={styles.link} href="/forgotidk">Forgot your password?</a>
<input type="submit" value="Log in"/>
<span className={styles.signin}>Need an account? <a className={styles.link} href="x">Sign up</a></span>
<span className={styles.signin}>Need an account? <a href="/register" className={styles.link} onClick={e => toggle(e, true)}>Sign up</a></span>
</div>
}
</form>
</div>
</div>
......