Fix: Format entire frontend properly

This commit is contained in:
Daniel Hougaard
2024-03-18 16:00:03 +01:00
parent 1ede551c3e
commit 9002e6cb33
230 changed files with 2752 additions and 2941 deletions
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
import { useRouter } from "next/router"
import { useRouter } from "next/router";
import { faWarning } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -7,9 +7,9 @@ import issueBackupKey from "@app/components/utilities/cryptography/issueBackupKe
import { Button } from "@app/components/v2";
interface DownloadBackupPDFStepProps {
email: string;
password: string;
name: string;
email: string;
password: string;
name: string;
}
/**
@@ -21,46 +21,48 @@ interface DownloadBackupPDFStepProps {
* @param {string} obj.name - user's name
* @returns
*/
export const BackupPDFStep = ({
email,
password,
name
}: DownloadBackupPDFStepProps) => {
const { t } = useTranslation();
const router = useRouter();
export const BackupPDFStep = ({ email, password, name }: DownloadBackupPDFStepProps) => {
const { t } = useTranslation();
const router = useRouter();
return (
<div className="flex flex-col items-center w-full h-full md:px-6 mx-auto mb-36 md:mb-16">
<p className="text-xl text-center font-medium flex justify-center text-transparent bg-clip-text bg-gradient-to-b from-white to-bunker-200">
<FontAwesomeIcon icon={faWarning} className="ml-2 mr-3 pt-1 text-2xl text-bunker-200" />{t("signup.step4-message")}
<div className="mx-auto mb-36 flex h-full w-full flex-col items-center md:mb-16 md:px-6">
<p className="flex justify-center bg-gradient-to-b from-white to-bunker-200 bg-clip-text text-center text-xl font-medium text-transparent">
<FontAwesomeIcon icon={faWarning} className="ml-2 mr-3 pt-1 text-2xl text-bunker-200" />
{t("signup.step4-message")}
</p>
<div className="flex flex-col pb-2 bg-mineshaft-800 border border-mineshaft-600 items-center justify-center text-center lg:w-1/6 w-full md:min-w-[24rem] mt-8 max-w-md text-bunker-300 text-md rounded-md">
<div className="w-full mt-4 md:mt-8 flex flex-row text-center items-center m-2 text-bunker-300 rounded-md lg:w-1/6 lg:w-1/6 w-full md:min-w-[23rem] px-3 mx-auto">
<span className='mb-2'>{t("signup.step4-description1")} {t("signup.step4-description3")}</span>
<div className="text-md mt-8 flex w-full max-w-md flex-col items-center justify-center rounded-md border border-mineshaft-600 bg-mineshaft-800 pb-2 text-center text-bunker-300 md:min-w-[24rem] lg:w-1/6">
<div className="m-2 mx-auto mt-4 flex w-full w-full flex-row items-center rounded-md px-3 text-center text-bunker-300 md:mt-8 md:min-w-[23rem] lg:w-1/6 lg:w-1/6">
<span className="mb-2">
{t("signup.step4-description1")} {t("signup.step4-description3")}
</span>
</div>
<div className="flex flex-col items-center px-3 justify-center mt-0 md:mt-4 mb-2 md:mb-4 lg:w-1/6 w-full md:min-w-[20rem] mt-2 md:max-w-md mx-auto text-sm text-center md:text-left">
<div className="text-l py-1 text-lg w-full">
<div className="mx-auto mt-0 mb-2 mt-2 flex w-full flex-col items-center justify-center px-3 text-center text-sm md:mt-4 md:mb-4 md:min-w-[20rem] md:max-w-md md:text-left lg:w-1/6">
<div className="text-l w-full py-1 text-lg">
<Button
onClick={async () => {
await issueBackupKey({
email,
password,
personalName: name,
setBackupKeyError: () => { },
setBackupKeyIssued: () => { }
setBackupKeyError: () => {},
setBackupKeyIssued: () => {}
});
router.push(`/org/${localStorage.getItem("orgData.id")}/overview`);
}}
size="sm"
isFullWidth
className='h-12'
className="h-12"
colorSchema="primary"
variant="outline_bg"
> Download PDF </Button>
>
{" "}
Download PDF{" "}
</Button>
</div>
</div>
</div>
</div>
);
}
};