Nomchy/discord.js
1
0
Fork 0
mirror of https://github.com/discordjs/discord.js.git synced 2026-03-19 13:03:31 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(website): breadcrumbs layout

Browse Source
This commit is contained in:
iCrawl
2022-08-12 17:04:12 +02:00
parent 2447165c82
commit 8e69efde04
1 changed files with 15 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
packages/website/src/components/SidebarLayout.tsx
View File

@@ -8,17 +8,22 @@ export function SidebarLayout({
children, children,
}: PropsWithChildren<Partial<ItemListProps & { data: { member: ReturnType<typeof findMember> } }>>) { }: PropsWithChildren<Partial<ItemListProps & { data: { member: ReturnType<typeof findMember> } }>>) {
return ( return (
<div className="flex flex-col lg:flex-row overflow-hidden max-w-full h-full max-h-full bg-white dark:bg-dark"> <div className="flex flex-col max-w-full h-full max-h-full bg-white dark:bg-dark">
<div className="h-full w-full lg:max-w-[310px] lg:min-w-[310px]"> <div className="flex min-h-[40px] border-0.5 border-b-0 border-gray items-center m-0 px-2 dark:text-white">
{packageName && data ? ( Breadcrumbs
<ItemSidebar packageName={packageName} data={data} selectedMember={data.member?.name} />
) : null}
</div> </div>
<div className="h-full grow">{children}</div> <div className="flex flex-col lg:flex-row overflow-hidden">
<div className="h-full w-full lg:max-w-[310px] lg:min-w-[310px]"> <div className="h-full w-full lg:max-w-[310px] lg:min-w-[310px]">
{packageName && data?.member ? ( {packageName && data ? (
<ItemSidebar packageName={packageName} data={data} selectedMember={data.member.name} /> <ItemSidebar packageName={packageName} data={data} selectedMember={data.member?.name} />
) : null} ) : null}
</div>
<div className="h-full grow">{children}</div>
<div className="h-full w-full lg:max-w-[310px] lg:min-w-[310px]">
{packageName && data?.member ? (
<ItemSidebar packageName={packageName} data={data} selectedMember={data.member.name} />
) : null}
</div>
</div> </div>
</div> </div>
); );