fix white flash?
Some checks failed
Deploy / deploy (ubuntu-latest, 2.44.0) (push) Has been cancelled

Took 7 minutes
This commit is contained in:
Braydon 2024-10-07 13:25:28 -04:00
parent 942938ad8f
commit 2c4e2bd0b1
3 changed files with 17 additions and 15 deletions

View File

@ -43,15 +43,16 @@ const RootLayout = ({
children: ReactNode; children: ReactNode;
}>): ReactElement => ( }>): ReactElement => (
<html lang="en"> <html lang="en">
<body <body className="scroll-smooth antialiased">
className="scroll-smooth antialiased" <ThemeProvider attribute="class" defaultTheme="dark" enableSystem>
<TooltipProvider delayDuration={100}>
<div
className="min-h-screen flex flex-col"
style={{ style={{
background: "var(--background-gradient)", background: "var(--background-gradient)",
}} }}
> >
<ThemeProvider attribute="class" defaultTheme="dark" enableSystem> <div className="px-3 sm:px-7 max-w-[90rem] mx-auto flex flex-col transition-all">
<TooltipProvider delayDuration={100}>
<div className="px-7 max-w-[90rem] mx-auto min-h-screen flex flex-col">
<Navbar /> <Navbar />
<div className="pt-[4.5rem] w-full h-full flex flex-grow gap-5"> <div className="pt-[4.5rem] w-full h-full flex flex-grow gap-5">
<div className="relative hidden xs:flex"> <div className="relative hidden xs:flex">
@ -61,6 +62,7 @@ const RootLayout = ({
</div> </div>
</div> </div>
<Footer /> <Footer />
</div>
</TooltipProvider> </TooltipProvider>
</ThemeProvider> </ThemeProvider>
</body> </body>

View File

@ -9,7 +9,7 @@ const Navbar = (): ReactElement => {
const pages: DocsContentMetadata[] = getDocsContent(); const pages: DocsContentMetadata[] = getDocsContent();
return ( return (
<nav className="fixed left-0 inset-x-0 bg-white/[0.007] backdrop-saturate-100 backdrop-blur-xl border-b z-50"> <nav className="fixed left-0 inset-x-0 bg-white/[0.007] backdrop-saturate-100 backdrop-blur-xl border-b z-50">
<div className="px-7 max-w-[90rem] mx-auto py-4 flex justify-between items-center"> <div className="px-3 sm:px-7 max-w-[90rem] mx-auto py-4 flex justify-between items-center transition-all transform-gpu">
{/* Branding */} {/* Branding */}
<Link <Link
className="flex gap-1 items-end hover:opacity-75 transition-all transform-gpu select-none" className="flex gap-1 items-end hover:opacity-75 transition-all transform-gpu select-none"

View File

@ -15,7 +15,7 @@ const Sidebar = (): ReactElement => (
<SheetTrigger className="flex items-center"> <SheetTrigger className="flex items-center">
<Bars3BottomRightIcon className="w-6 h-6" /> <Bars3BottomRightIcon className="w-6 h-6" />
</SheetTrigger> </SheetTrigger>
<SheetContent className="h-full px-11 pt-10" side="top"> <SheetContent className="h-full px-5 pt-11" side="right">
<SidebarContent /> <SidebarContent />
</SheetContent> </SheetContent>
</Sheet> </Sheet>