Mirrors/coco-app
1
0
Fork 0
mirror of https://github.com/infinilabs/coco-app.git synced 2025-12-29 00:24:46 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: add new error-page UI (#78)

Browse Source
This commit is contained in:
BiggerRain
2024-12-30 16:44:48 +08:00
committed by GitHub
parent c8ab3a9934
commit 5abbf76819
2 changed files with 16 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/error_page.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 37 KiB

16
src/error-page.tsx
View File

@@ -1,9 +1,25 @@
import { useRouteError } from "react-router-dom";
import errorImg from "./assets/error_page.png";
export default function ErrorPage() {
const error: any = useRouteError();
console.error(error);
return (
<div className="w-full h-screen bg-white shadow-[0px_16px_32px_0px_rgba(0,0,0,0.4)] rounded-xl border-[2px] border-[#E6E6E6] m-auto">
<div className="flex flex-col justify-center items-center">
<img src={errorImg} alt="error-page" className="w-[221px] h-[154px] mb-8 mt-[72px]"/>
<div className="w-[380px] h-[46px] px-5 font-normal text-base text-[rgba(0,0,0,0.85)] leading-[25px] text-center mb-4">
Sorry, there is an error in your Coco App. Please contact the administrator.
</div>
<div className="w-[380px] h-[45px] font-normal text-[10px] text-[rgba(135,135,135,0.85)] leading-[16px] text-center">
<i>{error.statusText || error.message}</i>
</div>
</div>
</div>
);
return (
<div id="error-page">
<div className="error-content">