2024-05-13 16:17:12 -04:00
|
|
|
import "@/styles/globals.scss";
|
2024-09-26 22:50:55 -04:00
|
|
|
|
|
|
|
|
import { AddressBar } from "@/components/address-bar";
|
|
|
|
|
import { GlobalNav } from "@/components/global-nav";
|
|
|
|
|
import { Theme } from "@/components/theme";
|
|
|
|
|
import { ThemeProvider } from "@/components/theme-provider";
|
2024-09-05 13:48:33 +02:00
|
|
|
import { Analytics } from "@vercel/analytics/react";
|
|
|
|
|
import { Lato } from "next/font/google";
|
2024-09-26 22:50:55 -04:00
|
|
|
import { ReactNode } from "react";
|
2023-04-03 13:39:51 +02:00
|
|
|
|
|
|
|
|
const lato = Lato({
|
2023-04-27 13:23:13 +02:00
|
|
|
weight: ["400", "700", "900"],
|
2023-04-14 13:35:27 +02:00
|
|
|
subsets: ["latin"],
|
2023-04-03 13:39:51 +02:00
|
|
|
});
|
|
|
|
|
|
2023-04-26 16:04:56 +02:00
|
|
|
export const revalidate = 60; // revalidate every minute
|
|
|
|
|
|
2023-04-22 20:16:47 +02:00
|
|
|
export default async function RootLayout({
|
2023-04-03 13:39:51 +02:00
|
|
|
children,
|
|
|
|
|
}: {
|
2024-09-26 22:50:55 -04:00
|
|
|
children: ReactNode;
|
2023-04-03 13:39:51 +02:00
|
|
|
}) {
|
2023-04-27 13:23:13 +02:00
|
|
|
// later only shown with dev mode enabled
|
2024-03-14 14:45:42 +01:00
|
|
|
const showNav = process.env.DEBUG === "true";
|
2023-04-27 13:23:13 +02:00
|
|
|
|
2023-05-22 11:48:18 +02:00
|
|
|
let domain = process.env.ZITADEL_API_URL;
|
|
|
|
|
domain = domain ? domain.replace("https://", "") : "acme.com";
|
|
|
|
|
|
2023-04-03 13:39:51 +02:00
|
|
|
return (
|
2023-04-19 14:56:01 +02:00
|
|
|
<html lang="en" className={`${lato.className}`} suppressHydrationWarning>
|
2023-04-03 13:39:51 +02:00
|
|
|
<head />
|
2023-04-19 14:56:01 +02:00
|
|
|
<body>
|
2024-04-01 10:19:30 +02:00
|
|
|
<ThemeProvider>
|
2024-04-01 10:00:31 +02:00
|
|
|
<div
|
2024-04-01 10:19:30 +02:00
|
|
|
className={`h-screen overflow-y-scroll bg-background-light-600 dark:bg-background-dark-600 ${
|
|
|
|
|
showNav
|
|
|
|
|
? "bg-[url('/grid-light.svg')] dark:bg-[url('/grid-dark.svg')]"
|
|
|
|
|
: ""
|
|
|
|
|
}`}
|
2024-04-01 10:00:31 +02:00
|
|
|
>
|
2024-04-01 10:19:30 +02:00
|
|
|
{showNav ? (
|
|
|
|
|
<GlobalNav />
|
|
|
|
|
) : (
|
|
|
|
|
<div className="absolute bottom-0 right-0 flex flex-row p-4">
|
|
|
|
|
<Theme />
|
|
|
|
|
</div>
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
className={`${
|
|
|
|
|
showNav ? "lg:pl-72" : ""
|
|
|
|
|
} pb-4 flex flex-col justify-center h-full`}
|
|
|
|
|
>
|
|
|
|
|
<div className="mx-auto max-w-[440px] space-y-8 pt-20 lg:py-8 w-full">
|
|
|
|
|
{showNav && (
|
|
|
|
|
<div className="rounded-lg bg-vc-border-gradient dark:bg-dark-vc-border-gradient p-px shadow-lg shadow-black/5 dark:shadow-black/20">
|
|
|
|
|
<div className="rounded-lg bg-background-light-400 dark:bg-background-dark-500">
|
|
|
|
|
<AddressBar domain={domain} />
|
|
|
|
|
</div>
|
2023-04-19 14:56:01 +02:00
|
|
|
</div>
|
2024-04-01 10:19:30 +02:00
|
|
|
)}
|
2024-04-01 10:00:31 +02:00
|
|
|
|
2024-04-01 10:19:30 +02:00
|
|
|
{children}
|
|
|
|
|
</div>
|
2024-04-01 10:00:31 +02:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
2024-04-01 10:19:30 +02:00
|
|
|
<Analytics />
|
|
|
|
|
</ThemeProvider>
|
2023-04-19 14:56:01 +02:00
|
|
|
</body>
|
2023-04-03 13:39:51 +02:00
|
|
|
</html>
|
|
|
|
|
);
|
|
|
|
|
}
|
