Some checks failed
lotteryfront CI / build (push) Has been cancelled
- Updated `getPublicCurrencies` and `getPlayerAuthCaptcha` functions to include `skipGlobalServerError` option, improving error handling for API requests. - Refactored the NotFoundPage component to enhance mobile responsiveness and UI consistency, integrating `PlayerMobileViewport`. - Improved the NetworkStatusBanner and OfflineBanner components by adding player banner height reference for better layout management. - Updated Wallet components to utilize `PlayerMoneyDisplay` for consistent currency representation and added credit mode handling in various screens. - Enhanced the WalletScreen and Transfer screens with loading panels and credit guard logic for better user experience during wallet operations.
74 lines
2.7 KiB
TypeScript
74 lines
2.7 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { FileQuestion, Home } from "lucide-react";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
import { PlayerMobileViewport } from "@/components/layout/player-mobile-viewport";
|
|
import { playerViewportColumnClass } from "@/lib/player-viewport";
|
|
import { cn } from "@/lib/utils";
|
|
import "@/i18n";
|
|
|
|
export default function NotFoundPage(): React.ReactElement {
|
|
const { t } = useTranslation("player");
|
|
|
|
return (
|
|
<PlayerMobileViewport>
|
|
<div
|
|
className={cn(
|
|
"flex min-h-dvh flex-col items-center justify-center bg-white px-4 py-8 text-slate-900",
|
|
playerViewportColumnClass,
|
|
)}
|
|
>
|
|
<div className="w-full rounded-2xl border border-[#e4eaf4] bg-white p-8 shadow-[0_10px_28px_rgba(15,23,42,0.08)]">
|
|
<div className="flex flex-col items-center text-center">
|
|
<div className="mb-4 flex size-16 items-center justify-center rounded-full bg-[#fff1f3]">
|
|
<FileQuestion className="size-8 text-[#e5002c]" aria-hidden />
|
|
</div>
|
|
|
|
<p className="text-6xl font-black tracking-tight text-[#0b3f96]/20">404</p>
|
|
|
|
<h1 className="mt-2 text-xl font-black text-[#0b3f96]">
|
|
{t("notFound.title")}
|
|
</h1>
|
|
|
|
<p className="mt-2 text-sm leading-relaxed text-slate-500">
|
|
{t("notFound.description")}
|
|
</p>
|
|
|
|
<Link
|
|
href="/hall"
|
|
className="mt-6 inline-flex h-11 w-full items-center justify-center gap-2 rounded-xl bg-[#e5002c] text-sm font-bold text-white shadow-[0_8px_20px_rgba(229,0,44,0.22)] hover:bg-[#d10028]"
|
|
>
|
|
<Home className="size-4" aria-hidden />
|
|
{t("notFound.home")}
|
|
</Link>
|
|
|
|
<div className="mt-6 flex flex-wrap items-center justify-center gap-x-3 gap-y-1 text-xs font-semibold text-[#32518d]">
|
|
<Link href="/hall" className="hover:text-[#0b3f96] hover:underline">
|
|
{t("notFound.hall")}
|
|
</Link>
|
|
<span className="text-slate-300" aria-hidden>
|
|
|
|
|
</span>
|
|
<Link href="/results" className="hover:text-[#0b3f96] hover:underline">
|
|
{t("notFound.results")}
|
|
</Link>
|
|
<span className="text-slate-300" aria-hidden>
|
|
|
|
|
</span>
|
|
<Link href="/wallet" className="hover:text-[#0b3f96] hover:underline">
|
|
{t("notFound.funds")}
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<p className="mt-8 text-xs text-slate-400">
|
|
Lottery © {new Date().getFullYear()}
|
|
</p>
|
|
</div>
|
|
</PlayerMobileViewport>
|
|
);
|
|
}
|