mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-18 19:46:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

docs: flatten side nav hierarchy

Browse source
This commit is contained in:
Eric Liu 2022-08-06 13:06:32 -07:00
commit 77c8fcfb6d
1 changed files with 27 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

71
docs/src/pages/_layout.svelte
View file

@ -11,7 +11,6 @@
SkipToContent, SkipToContent,
SideNav, SideNav,
SideNavItems, SideNavItems,
SideNavMenu,
SideNavMenuItem, SideNavMenuItem,
Tag, Tag,
} from "carbon-components-svelte"; } from "carbon-components-svelte";
@ -29,7 +28,6 @@
$: components = $layout.children.filter( $: components = $layout.children.filter(
(child) => child.title === "components" (child) => child.title === "components"
)[0]; )[0];
$: recipes = $layout.children.filter((child) => child.title === "recipes")[0];
$beforeUrlChange(() => { $beforeUrlChange(() => {
if (isMobile) isSideNavOpen = false; if (isMobile) isSideNavOpen = false;
@ -99,48 +97,33 @@
<SideNav bind:isOpen="{isSideNavOpen}"> <SideNav bind:isOpen="{isSideNavOpen}">
<SideNavItems> <SideNavItems>
<SideNavMenu {#each components.children.filter((child) => !deprecated.includes(child.title)) as child (child.path)}
expanded="{$isActive($url('')) || $isActive($url('/components'))}" <SideNavMenuItem
text="Components" text="{child.title}"
> href="{$url(child.path)}"
{#each components.children.filter((child) => !deprecated.includes(child.title)) as child, i (child.path)} isSelected="{$isActive($url(child.path))}"
<SideNavMenuItem >
text="{child.title}" {child.title}
href="{$url(child.path)}" {#if deprecated.includes(child.title)}
isSelected="{$isActive($url(child.path))}" <Tag
> size="sm"
{child.title} type="red"
{#if deprecated.includes(child.title)} style="margin-top: 0; margin-bottom: 0; cursor: inherit"
<Tag >
size="sm" Deprecated
type="red" </Tag>
style="margin-top: 0; margin-bottom: 0; cursor: inherit" {/if}
> {#if new_components.includes(child.title)}
Deprecated <Tag
</Tag> size="sm"
{/if} type="green"
{#if new_components.includes(child.title)} style="margin-top: 0; margin-bottom: 0; cursor: inherit"
<Tag >
size="sm" New
type="green" </Tag>
style="margin-top: 0; margin-bottom: 0; cursor: inherit" {/if}
> </SideNavMenuItem>
New {/each}
</Tag>
{/if}
</SideNavMenuItem>
{/each}
</SideNavMenu>
<SideNavMenu expanded="{$isActive($url('/recipes'))}" text="Recipes">
{#each recipes.children as child, i (child.path)}
<SideNavMenuItem
href="{$url(child.path)}"
isSelected="{$isActive($url(child.path))}"
>
{child.title}
</SideNavMenuItem>
{/each}
</SideNavMenu>
</SideNavItems> </SideNavItems>
</SideNav> </SideNav>
<slot /> <slot />