mirror of
https://github.com/randyjc/Rahoot.git
synced 2026-03-13 20:15:35 +01:00
logo alignment fix
This commit is contained in:
@@ -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" />
|
||||
<BrandHeading size="lg" />
|
||||
{inner}
|
||||
</section>
|
||||
)
|
||||
|
||||
if (!isConnected) {
|
||||
return (
|
||||
<Shell>
|
||||
<div className="flex flex-col items-center gap-3">
|
||||
<Loader className="h-23" />
|
||||
<h2 className="mt-2 text-center text-2xl font-bold text-white drop-shadow-lg md:text-3xl">
|
||||
<h2 className="text-2xl font-bold text-white drop-shadow-lg md:text-3xl">
|
||||
Loading...
|
||||
</h2>
|
||||
</section>
|
||||
</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
|
||||
|
||||
@@ -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,
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user