69 lines
2.1 KiB
TypeScript
69 lines
2.1 KiB
TypeScript
import MenuContainer from "@root/src/components/atoms/MenuContainer";
|
|
import ThemeButton from "@root/src/components/organisms/ThemeButton";
|
|
import { main } from "@root/src/configure";
|
|
import { useTranslation } from "react-i18next";
|
|
import LanguageButton from "../organisms/LanguageButton";
|
|
interface LoginPageTemplateProps {
|
|
handleLogin: () => void;
|
|
getStartedOnClick: () => void;
|
|
}
|
|
const LoginPageTemplate = ({
|
|
handleLogin,
|
|
getStartedOnClick,
|
|
}: LoginPageTemplateProps) => {
|
|
const { t } = useTranslation();
|
|
return (
|
|
<div className="hero min-h-screen bg-base-200">
|
|
<MenuContainer position="top-right" tooltipPosition="left">
|
|
<ThemeButton />
|
|
<LanguageButton />
|
|
</MenuContainer>
|
|
<div className="flex-col justify-center hero-content lg:flex-row-reverse">
|
|
<div className="text-center lg:text-left">
|
|
<h1 className="mb-5 text-5xl font-bold">{main.program_name}</h1>
|
|
<p className="mb-5">{main.program_description}</p>
|
|
<button className="btn btn-outline" onClick={getStartedOnClick}>
|
|
{t("button.navigation.more")}
|
|
</button>
|
|
</div>
|
|
<div className="card flex-shrink-0 w-full max-w-sm shadow-2xl bg-base-100">
|
|
<div className="card-body">
|
|
<form>
|
|
<div className="form-control">
|
|
<label className="label">
|
|
<span className="label-text">{t("input.username")}</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
placeholder={t("input.username")}
|
|
className="input input-bordered"
|
|
/>
|
|
</div>
|
|
<div className="form-control">
|
|
<label className="label">
|
|
<span className="label-text">{t("input.password")}</span>
|
|
</label>
|
|
<input
|
|
type="password"
|
|
placeholder={t("input.password")}
|
|
className="input input-bordered"
|
|
/>
|
|
</div>
|
|
<div className="form-control mt-6">
|
|
<input
|
|
className="btn btn-primary"
|
|
onClick={handleLogin}
|
|
defaultValue={t("button.action.login")}
|
|
type="button"
|
|
/>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default LoginPageTemplate;
|