franpcode/Pomodoro-Timer-with-Clockify-integration
1
0
Fork 0
mirror of https://github.com/FranP-code/Pomodoro-Timer-with-Clockify-integration.git synced 2025-10-12 23:52:30 +00:00
Code Issues 1 Packages Projects Releases Wiki Activity

Style and dinamic URL for the form done

Browse Source
This commit is contained in:
Francisco Pessano
2021-09-25 19:20:06 -03:00
parent 8e72320c28
commit 5fb6f228ea
7 changed files with 67 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Identify Childrens/LoginForm.jsx
View File

@@ -5,7 +5,7 @@ const LoginForm = () => {
<form>
<input type="email" placeholder="Email"></input>
<input type="password" placeholder="Password"></input>
<input type="submit"></input>
<input type="submit" value="Login"></input>
</form>
)
}

2
src/components/Identify Childrens/RegisterForm.jsx
View File

@@ -6,7 +6,7 @@ const RegisterForm = () => {
<input type="email" placeholder="Email"></input>
<input type="password" placeholder="Password"></input>
<input type="password" placeholder="Confirm Password"></input>
<input type="submit"></input>
<input type="submit" value="Register"></input>
</form>
)
}

52
src/components/Identify.jsx
View File

@@ -6,6 +6,30 @@ import RegisterForm from './Identify Childrens/RegisterForm'
const Identify = () => {
const [act, setAct] = useState('register')
const defineLogin = () => {
if (act !== 'login') {
setAct('login')
}
}
const defineRegister = () => {
if (act !== 'register') {
setAct('register')
}
}
React.useEffect( () => {
const urlInfo = new URLSearchParams(window.location.search)
const action = urlInfo.get('act')
if (action === 'r') {
setAct('register')
} else {
setAct('login')
}
}, [])
return (
<div className="identify-container">
@@ -13,11 +37,31 @@ const Identify = () => {
<nav className="options-container">
<div className="option">
<div
className={
act === 'login' ? 'option active-option': 'option'
}
onClick={() => {
defineLogin()
}}
>
<h2>LOGIN</h2>
</div>
<div className="option">
<div
className={
act === 'register' ? 'option active-option': 'option'
}
onClick={() => {
defineRegister()
}}
>
<h2>REGISTER</h2>
</div>
@@ -25,10 +69,10 @@ const Identify = () => {
<div className="form-container">
{
act === 'login' ? <LoginForm /> : null
act === 'login' ? <LoginForm action={act}/> : null
}
{
act === 'register' ? <RegisterForm /> : null
act === 'register' ? <RegisterForm action={act}/> : null
}
</div>
</div>