2 Commits

Author SHA1 Message Date
96b79d9995 better sidebar responsiveness
All checks were successful
Deploy / deploy (ubuntu-latest, 2.44.0) (push) Successful in 56s
Took 8 minutes
2024-10-06 18:15:57 -04:00
f73c2a61e6 better navbar responsiveness
Took 9 minutes
2024-10-06 18:08:12 -04:00
4 changed files with 109 additions and 47 deletions

View File

@ -5,4 +5,69 @@ summary: 'petentium usu tota noluisse errem elaboraret auctor.'
--- ---
# Get started with Pulse App! # Get started with Pulse App!
petentium usu tota noluisse errem elaboraret auctor. petentium usu tota noluisse errem elaboraret auctor.
petentium usu tota noluisse errem elaboraret auctor.
petentium usu tota noluisse errem elaboraret auctor.
petentium usu tota noluisse errem elaboraret auctor.
petentium usu tota noluisse errem elaboraret auctor.
petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.
## petentium usu tota noluisse errem elaboraret auctor.

View File

@ -51,8 +51,8 @@ const RootLayout = ({
<ThemeProvider attribute="class" defaultTheme="dark" enableSystem> <ThemeProvider attribute="class" defaultTheme="dark" enableSystem>
<div className="px-7 max-w-[90rem] mx-auto min-h-screen flex flex-col"> <div className="px-7 max-w-[90rem] mx-auto min-h-screen flex flex-col">
<Navbar /> <Navbar />
<div className="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="hidden xs:flex"> <div className="relative hidden xs:flex pr-40 sm:pr-52">
<Sidebar /> <Sidebar />
</div> </div>
{children} {children}

View File

@ -9,51 +9,48 @@ import Sidebar from "@/components/sidebar/sidebar";
const Navbar = (): ReactElement => { const Navbar = (): ReactElement => {
const pages: DocsContentMetadata[] = getDocsContent(); const pages: DocsContentMetadata[] = getDocsContent();
return ( return (
<nav <nav className="fixed left-0 inset-x-0 bg-white/[0.007] backdrop-saturate-100 backdrop-blur-xl border-b">
className={cn( <div className="px-7 max-w-[90rem] mx-auto py-4 flex justify-between items-center">
"py-4 flex justify-between items-center", {/* Branding */}
"after:absolute after:inset-x-0 after:top-[4.2rem] after:h-0.5 after:bg-muted/55" <Link
)} className="flex gap-1 items-end hover:opacity-75 transition-all transform-gpu select-none"
> href="/public"
{/* Branding */} draggable={false}
<Link >
className="flex gap-1 items-end hover:opacity-75 transition-all transform-gpu select-none" <h1 className="text-lg font-semibold">docs.</h1>
href="/public" <Image
draggable={false} src="/media/logo.png"
> alt="Pulse App Logo"
<h1 className="text-lg font-semibold">docs.</h1> width={36}
<Image height={36}
src="/media/logo.png"
alt="Pulse App Logo"
width={36}
height={36}
/>
</Link>
{/* Right */}
<div className="flex gap-5 sm:gap-7 items-center transition-all transform-gpu">
{/* Search */}
<div className="hidden xs:flex">
<QuickSearchDialog pages={pages} />
</div>
{/* Social */}
<div className="flex gap-5 items-center">
<SocialLink
name="GitHub"
link="https://github.com/PulseAppCC"
icon="/media/github.svg"
/> />
<SocialLink </Link>
name="Discord"
link="https://discord.pulseapp.cc"
icon="/media/discord.svg"
/>
</div>
{/* Mobile Sidebar */} {/* Right */}
<div className="flex xs:hidden"> <div className="flex gap-5 sm:gap-7 items-center transition-all transform-gpu">
<Sidebar /> {/* Search */}
<div className="hidden xs:flex">
<QuickSearchDialog pages={pages} />
</div>
{/* Social */}
<div className="flex gap-5 items-center">
<SocialLink
name="GitHub"
link="https://github.com/PulseAppCC"
icon="/media/github.svg"
/>
<SocialLink
name="Discord"
link="https://discord.pulseapp.cc"
icon="/media/discord.svg"
/>
</div>
{/* Mobile Sidebar */}
<div className="flex xs:hidden">
<Sidebar />
</div>
</div> </div>
</div> </div>
</nav> </nav>

View File

@ -22,7 +22,7 @@ const Sidebar = (): ReactElement => (
</div> </div>
{/* Desktop */} {/* Desktop */}
<div className="hidden min-w-32 w-40 sm:w-52 py-3 xs:flex flex-col justify-between transition-all transform-gpu"> <div className="hidden fixed top-20 inset-y-0 min-w-32 w-40 sm:w-52 py-3 xs:flex flex-col justify-between transition-all transform-gpu">
<SidebarContent /> <SidebarContent />
</div> </div>
</> </>