logo alignment fix

This commit is contained in:
RandyJC
2025-12-09 11:54:53 +01:00
parent dba5024207
commit efbea1801c
2 changed files with 23 additions and 25 deletions

View File

@@ -13,34 +13,32 @@ const AuthLayout = ({ children }: PropsWithChildren) => {
}
}, [connect, isConnected])
if (!isConnected) {
return (
<section className="relative flex min-h-screen flex-col items-center justify-center">
<div className="pointer-events-none absolute h-full w-full overflow-hidden">
<div className="bg-primary/15 absolute -top-[15vmin] -left-[15vmin] min-h-[75vmin] min-w-[75vmin] rounded-full"></div>
<div className="bg-primary/15 absolute -right-[15vmin] -bottom-[15vmin] min-h-[75vmin] min-w-[75vmin] rotate-45"></div>
const Shell = ({ children: inner }: PropsWithChildren) => (
<section className="relative flex min-h-screen flex-col items-center justify-center gap-6 px-4 text-center">
<div className="pointer-events-none absolute inset-0 overflow-hidden">
<div className="bg-primary/15 absolute -top-[15vmin] -left-[15vmin] min-h-[75vmin] min-w-[75vmin] rounded-full" />
<div className="bg-primary/15 absolute -right-[15vmin] -bottom-[15vmin] min-h-[75vmin] min-w-[75vmin] rotate-45" />
</div>
<BrandHeading className="mb-6" size="lg" />
<Loader className="h-23" />
<h2 className="mt-2 text-center text-2xl font-bold text-white drop-shadow-lg md:text-3xl">
Loading...
</h2>
</section>
<BrandHeading size="lg" />
{inner}
</section>
)
if (!isConnected) {
return (
<Shell>
<div className="flex flex-col items-center gap-3">
<Loader className="h-23" />
<h2 className="text-2xl font-bold text-white drop-shadow-lg md:text-3xl">
Loading...
</h2>
</div>
</Shell>
)
}
return (
<section className="relative flex min-h-screen flex-col items-center justify-center">
<div className="pointer-events-none absolute h-full w-full overflow-hidden">
<div className="bg-primary/15 absolute -top-[15vmin] -left-[15vmin] min-h-[75vmin] min-w-[75vmin] rounded-full"></div>
<div className="bg-primary/15 absolute -right-[15vmin] -bottom-[15vmin] min-h-[75vmin] min-w-[75vmin] rotate-45"></div>
</div>
<BrandHeading className="mb-6" size="lg" />
{children}
</section>
)
return <Shell>{children}</Shell>
}
export default AuthLayout

View File

@@ -14,13 +14,13 @@ const BrandHeading = ({ className, size = "lg" }: Props) => {
const sizeClass =
size === "lg"
? "text-4xl md:text-5xl"
? "text-4xl md:text-5xl lg:text-6xl"
: "text-2xl md:text-3xl"
return (
<div
className={clsx(
"text-center font-black tracking-tight text-[#f7931e] drop-shadow-lg",
"text-center font-black tracking-tight text-[#f7931e] drop-shadow-lg leading-tight",
sizeClass,
className,
)}