Bachelorthesis_Code/frontend/src/components/HeroSection.js
cami 00aa826971 Added Button if the user is logged in and css
Added a button if the user is already logged in which will directly go to the study
- make buttons minimal width
2021-07-11 00:08:11 +02:00

58 lines
1.4 KiB
JavaScript

import React from "react";
import "../App.css";
import { Button } from "./Button";
import "./HeroSection.css";
import "@fortawesome/fontawesome-free/css/all.css";
import { useAuth } from "../auth/AuthProvider";
function HeroSection() {
const [isLoggedIn] = useAuth();
return (
<div className="hero-container">
<h1>Herzlich Willkommen</h1>
<div className="hero-btns">
{isLoggedIn ? (
<Button
className="btns"
buttonStyle="btn--primary"
buttonSize="btn--large"
newTo="behavior"
>
Zur Studie
</Button>
) : (
<>
<Button
className="btns"
buttonStyle="btn--primary"
buttonSize="btn--large"
newTo="login"
>
Einloggen (wenn du schon einmal mitgemacht hast)
</Button>
<Button
className="btns"
buttonStyle="btn--primary"
buttonSize="btn--large"
newTo="register"
>
Registrieren (falls du das erste Mal hier bist)
</Button>
</>
)}
<Button
className="btns"
buttonStyle="btn--primary"
buttonSize="btn--large"
newTo="manual"
>
Anleitung
</Button>
</div>
</div>
);
}
export default HeroSection;