latest changes
This commit is contained in:
remco committed
1 parent
56cd6fd058
commit
1de72863db
40 files changed
+3837
-568
No files matched your search
@@ -20,94 +20,66 @@ export async function SiteHeader() {
|
||||
online = 0;
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
className="relative flex min-h-[13rem] h-52 w-full items-center justify-center"
|
||||
style={{ background: `url(${header})`, backgroundSize: "cover", backgroundPosition: "center" }}
|
||||
>
|
||||
<div className="absolute h-full w-full bg-black/50" />
|
||||
|
||||
{session?.user ? (
|
||||
<div className="relative flex h-full w-full max-w-7xl items-center justify-center pr-10 md:justify-between">
|
||||
<div className="flex items-center gap-x-4">
|
||||
<Link href="/" className="ml-7">
|
||||
if (session?.user) {
|
||||
return (
|
||||
<div
|
||||
className="relative flex min-h-[13rem] h-52 w-full items-center justify-center"
|
||||
style={{ background: `url(${header})`, backgroundSize: "cover", backgroundPosition: "center" }}
|
||||
>
|
||||
<div className="absolute h-full w-full bg-black/50" />
|
||||
<div className="relative flex items-center justify-center w-full px-4">
|
||||
<div className="flex flex-col items-center justify-center max-w-[600px]">
|
||||
<Link href="/" className="transition-all duration-300 hover:scale-110 mb-2.5">
|
||||
{logo ? (
|
||||
// biome-ignore lint/performance/noImgElement: external/CDN logo
|
||||
<img
|
||||
className="transition duration-300 ease-in-out hover:scale-105"
|
||||
src={logo}
|
||||
alt="Hotel logo"
|
||||
/>
|
||||
<img className="drop-shadow block" src={logo} alt="Hotel logo" />
|
||||
) : (
|
||||
<span className="text-3xl font-extrabold text-white text-shadow">{hotelName}</span>
|
||||
<span className="text-4xl font-extrabold text-white text-shadow">{hotelName}</span>
|
||||
)}
|
||||
</Link>
|
||||
|
||||
<div
|
||||
className="hidden md:flex items-center px-4 rounded-md relative h-[50px]"
|
||||
style={{ backgroundColor: "var(--color-surface)", color: "var(--color-text)" }}
|
||||
>
|
||||
<div
|
||||
className="absolute -left-1 h-6 w-6 rotate-45"
|
||||
style={{ backgroundColor: "var(--color-surface)" }}
|
||||
/>
|
||||
<span className="relative">
|
||||
{t("online", { count: online, hotel: hotelName ?? "Atom" })}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-y-2 md:flex-row md:gap-x-4">
|
||||
<Link href="/client">
|
||||
<button
|
||||
type="button"
|
||||
className="font-bold py-3 px-6 rounded-xl shadow-xl border-2 transition-all duration-300 hover:scale-110 hover:shadow-2xl text-base tracking-wide"
|
||||
style={{
|
||||
backgroundColor: "var(--button-color)",
|
||||
color: "var(--button-text-color)",
|
||||
borderColor: "rgba(255,255,255,0.3)",
|
||||
}}
|
||||
>
|
||||
{t("nitroClient")}
|
||||
</button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="relative flex justify-center px-4">
|
||||
<div
|
||||
className="font-semibold flex flex-col items-center md:w-[600px]"
|
||||
style={{ color: "#ffffff", textShadow: "0 1px 4px rgba(0,0,0,0.7)" }}
|
||||
>
|
||||
<p className="hidden text-center text-xl md:block">{t("tagline")}</p>
|
||||
<div className="flex flex-col items-center justify-center gap-x-6 gap-y-4 md:mt-6 md:flex-row md:gap-y-0">
|
||||
<Link href="/login">
|
||||
<button
|
||||
type="button"
|
||||
className="rounded-full border-2 px-8 py-2 uppercase transition duration-200 ease-in-out"
|
||||
style={{
|
||||
borderColor: "var(--color-primary)",
|
||||
backgroundColor: "var(--color-primary)",
|
||||
color: "var(--button-text-color)",
|
||||
}}
|
||||
>
|
||||
{t("login")}
|
||||
</button>
|
||||
</Link>
|
||||
<p className="text-sm uppercase">{t("or")}</p>
|
||||
<Link href="/register">
|
||||
<button
|
||||
type="button"
|
||||
className="uppercase px-8 py-2.5 rounded-full transition ease-in-out duration-200"
|
||||
style={{ backgroundColor: "var(--color-accent)", color: "#ffffff" }}
|
||||
>
|
||||
{t("createAccount")}
|
||||
</button>
|
||||
</Link>
|
||||
<div className="relative flex items-center bg-white dark:bg-gray-800 rounded-md h-[50px] px-4 mt-2">
|
||||
<div className="absolute w-6 h-6 bg-white dark:bg-gray-800 rotate-45 -translate-x-1/2 left-1/2 -top-3 z-0" aria-hidden="true" />
|
||||
<div className="flex items-center gap-x-2 relative z-10">
|
||||
<img src="/assets/images/user-online.png" alt="Online Icon" className="p-1" style={{ marginTop: "-2px" }} />
|
||||
<span className="whitespace-nowrap text-gray-800 dark:text-white">
|
||||
{t("online", { count: online, hotel: hotelName ?? "Atom" })}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
className="relative flex items-center justify-center w-full h-52"
|
||||
style={{
|
||||
backgroundImage: `url(/assets/images/mybobba_banner.png)`,
|
||||
backgroundSize: "cover",
|
||||
backgroundPosition: "center",
|
||||
backgroundRepeat: "no-repeat",
|
||||
}}
|
||||
>
|
||||
<div className="absolute w-full h-full bg-black/50" />
|
||||
<div className="relative flex flex-col items-center justify-center px-4">
|
||||
<Link href="/" className="transition-all duration-300 hover:scale-110 mb-2.5">
|
||||
{logo ? (
|
||||
<img className="drop-shadow block" src={logo} alt="Hotel logo" />
|
||||
) : (
|
||||
<span className="text-4xl font-extrabold text-white text-shadow">{hotelName}</span>
|
||||
)}
|
||||
</Link>
|
||||
<div className="relative flex items-center bg-white dark:bg-gray-800 rounded-md h-[50px] px-4 mt-2">
|
||||
<div className="absolute w-6 h-6 bg-white dark:bg-gray-800 rotate-45 -translate-x-1/2 left-1/2 -top-3 z-0" aria-hidden="true" />
|
||||
<div className="flex items-center gap-x-2 relative z-10">
|
||||
<img src="/assets/images/user-online.png" alt="Online Icon" className="p-1" style={{ marginTop: "-2px" }} />
|
||||
<span className="whitespace-nowrap text-gray-800 dark:text-white">
|
||||
{t("online", { count: online, hotel: hotelName ?? "Atom" })}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in new issue
Block a user