Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

simplify nav #8736

Merged
merged 7 commits into from
Jun 16, 2023
Merged

simplify nav #8736

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
22dc536
simplify nav
Jun 15, 2023
2231e7e
updates
Jun 16, 2023
a736e9a
Merge branch 'sites' into simplify-nav
Jun 16, 2023
3ff8cdb
fix link
Jun 16, 2023
14983c3
Dont need this anymore
PuruVJ Jun 16, 2023
29a184e
bump
Jun 16, 2023
5d58488
Merge branch 'simplify-nav' of github.com:sveltejs/svelte into simpli…
Jun 16, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions pnpm-lock.yaml
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion sites/svelte.dev/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@
"@resvg/resvg-js": "^2.4.1",
"@sveltejs/adapter-vercel": "^3.0.0",
"@sveltejs/kit": "^1.20.0",
"@sveltejs/site-kit": "6.0.0-next.3",
"@sveltejs/site-kit": "6.0.0-next.4",
"@sveltejs/vite-plugin-svelte": "^2.4.1",
"@types/marked": "^5.0.0",
"@types/node": "^20.2.6",
Expand Down
11 changes: 0 additions & 11 deletions sites/svelte.dev/src/global.d.ts
View file
Open in desktop

This file was deleted.

42 changes: 35 additions & 7 deletions sites/svelte.dev/src/routes/+layout.server.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,9 @@ function get_nav_title(url) {
return '';
}

/**
* @returns {Promise<import('@sveltejs/site-kit').NavigationLink[]>}
*/
async function get_nav_context_list() {
const docs_list = get_docs_list(get_docs_data());
const processed_docs_list = docs_list.map(({ title, pages }) => ({
Expand Down Expand Up @@ -58,17 +61,42 @@ async function get_nav_context_list() {
}))
.filter(({ title }) => title !== 'Embeds');

return {
docs: processed_docs_list,
blog: processed_blog_list,
tutorial: processed_tutorial_list,
examples: processed_examples_list
};
return [
{
title: 'Tutorial',
prefix: 'tutorial',
pathname: '/tutorial',
sections: processed_tutorial_list
},
{
title: 'Docs',
prefix: 'docs',
pathname: '/docs/introduction',
sections: processed_docs_list
},
{
title: 'Examples',
prefix: 'examples',
pathname: '/examples',
sections: processed_examples_list
},
{
title: 'REPL',
prefix: 'repl',
pathname: '/repl'
},
{
title: 'Blog',
prefix: 'blog',
pathname: '/blog',
sections: processed_blog_list
}
];
}

export const load = async ({ url }) => {
return {
nav_title: get_nav_title(url),
nav_context_list: get_nav_context_list()
nav_links: get_nav_context_list()
};
};
68 changes: 16 additions & 52 deletions sites/svelte.dev/src/routes/+layout.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,11 @@
import { browser } from '$app/environment';
import { page } from '$app/stores';
import { Icon, Shell } from '@sveltejs/site-kit/components';
import { Nav, NavItem, Separator } from '@sveltejs/site-kit/nav';
import { Nav, Separator } from '@sveltejs/site-kit/nav';
import { Search, SearchBox } from '@sveltejs/site-kit/search';
import '@sveltejs/site-kit/styles/index.css';

export let data;
</script>

<svelte:head>
Expand All @@ -17,7 +19,7 @@

<div style:display={$page.url.pathname !== '/docs' ? 'contents' : 'none'}>
<Shell nav_visible={$page.url.pathname !== '/repl/embed'}>
<Nav slot="top-nav">
<Nav slot="top-nav" title={data.nav_title} links={data.nav_links}>
<svelte:fragment slot="home-large">
<strong>svelte</strong>.dev
</svelte:fragment>
Expand All @@ -26,62 +28,24 @@
<strong>svelte</strong>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think we need this for the svelte site. I left that example as reference for kit and learn

</svelte:fragment>

<svelte:fragment slot="nav-center">
<svelte:fragment slot="search">
{#if $page.url.pathname !== '/search'}
<li><Search /></li>
<Search />
{/if}
</svelte:fragment>

<svelte:fragment slot="nav-right">
<NavItem
href="/tutorial"
selected={$page.url.pathname.startsWith('/tutorial') || null}
relatedMenuName="tutorial"
>
Tutorial
</NavItem>

<NavItem
href="/docs/introduction"
selected={$page.url.pathname.startsWith('/docs') || null}
relatedMenuName="docs"
>
Docs
</NavItem>

<NavItem
href="/examples"
selected={$page.url.pathname.startsWith('/examples') || null}
relatedMenuName="examples"
>
Examples
</NavItem>

<NavItem href="/repl" selected={$page.url.pathname.startsWith('/repl') || null}>
REPL
</NavItem>

<NavItem
href="/blog"
selected={$page.url.pathname.startsWith('/blog') || null}
relatedMenuName="blog"
>
Blog
</NavItem>

<Separator />

<NavItem href="https://kit.svelte.dev" external>SvelteKit</NavItem>
<svelte:fragment slot="external-links">
<a href="https://kit.svelte.dev">SvelteKit</a>

<NavItem href="/chat" external title="Discord Chat">
<span slot="small">Discord</span>
<Icon name="discord" />
</NavItem>
<a href="/chat" title="Discord Chat">
<span class="small">Discord</span>
<span class="large"><Icon name="discord" /></span>
</a>

<NavItem href="https://github.com/sveltejs/svelte" external title="GitHub Repo">
<span slot="small">GitHub</span>
<Icon name="github" />
</NavItem>
<a href="https://github.com/sveltejs/svelte" title="GitHub Repo">
<span class="small">GitHub</span>
<span class="large"><Icon name="github" /></span>
</a>
</svelte:fragment>
</Nav>

Expand Down