diff options
Diffstat (limited to 'src/pages')
| -rw-r--r-- | src/pages/login.tsx | 35 | ||||
| -rw-r--r-- | src/pages/register.tsx | 28 |
2 files changed, 63 insertions, 0 deletions
diff --git a/src/pages/login.tsx b/src/pages/login.tsx new file mode 100644 index 0000000..bbbd363 --- /dev/null +++ b/src/pages/login.tsx @@ -0,0 +1,35 @@ +import { NavBar } from '../components/navbar'; +import { CenteredPage, PageTitle } from '../components/page'; +import { Vierkant, Input, Button } from '../components/ui'; + +export default function LoginPage() { + return ( + <div> + <NavBar/> + <CenteredPage width={500} style={{ height: "100vh" }}> + <div style={{ + position: "relative", + top: "50%", + transform: "translateY(-50%)", + margin: "0 auto", + textAlign: "center" + }}> + <Vierkant> + <Input label="email of gebruikersnaam" style={{ marginBottom: 12 }}></Input> + <Input label="wachtwoord" type="password"></Input> + <div style={{ + marginTop: 24, + gridGap: 24, + display: "grid", + gridTemplateColumns: "1fr 1fr" + }}> + <Button text="Registreren" style={{ backgroundColor: "var(--background-alt)" }} onclick={() => window.location.pathname = "/register"}></Button> + <Button text="Inloggen"></Button> + </div> + </Vierkant> + </div> + </CenteredPage> + </div> + ); +} + diff --git a/src/pages/register.tsx b/src/pages/register.tsx new file mode 100644 index 0000000..4ab3106 --- /dev/null +++ b/src/pages/register.tsx @@ -0,0 +1,28 @@ +import { NavBar } from '../components/navbar'; +import { CenteredPage, PageTitle } from '../components/page'; +import { Vierkant, Input, Button } from '../components/ui'; + +export default function RegisterPage() { + return ( + <div> + <NavBar/> + <CenteredPage width={500} style={{ height: "100vh" }}> + <div style={{ + position: "relative", + top: "50%", + transform: "translateY(-50%)", + margin: "0 auto", + textAlign: "center" + }}> + <Vierkant> + <Input label="gebruikersnaam" style={{ marginBottom: 12 }}></Input> + <Input label="email" style={{ marginBottom: 12 }}></Input> + <Input label="wachtwoord" type="password"></Input> + <Button text="Registreren" style={{ marginTop: 24 }}></Button> + </Vierkant> + </div> + </CenteredPage> + </div> + ); +} + |