[docs] Separate some pages out of the Docs section (#1626)

This PR changes the structure of the docs site's sidebar.


![image](https://github.com/tldraw/tldraw/assets/15892272/ffe1e152-c921-43f0-9ba2-d084bda5e1e3)

I think this signposts more clearly what the different pages are for.
And it also paves the way for some work I want to do on
expanding+refining the Editor docs.

This PR also simplifies URL for all sidebar links.
It's a bit scrappy, but I think it feels simple enough to work with, and
easy-enough to change in the future.
> But hey! I've been doing this a couple times recently. Maybe we should
refactor? Or maybe we should keep going with what we've got and focus on
getting these docs *done*.

### Change Type

- [x] `documentation` — Changes to the documentation only[^2]

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Check that all the sidebar links go to where you expect.
2. Check that old URLs redirect to the right pages, eg: `/docs/usage`
should go to the usage page.


### Release Notes

- Documentation: Restructured the sidebar for clarity.
This commit is contained in:
Lu Wilson 2023-06-23 10:53:22 +01:00 committed by GitHub
parent d2c51ae3ba
commit c5fe399842
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 119 additions and 36 deletions

View file

@ -15,8 +15,12 @@ export function Breadcrumb({
<Link href={`/`}>tldraw</Link>
{section && (
<>
{` / `}
<Link href={`/${section.id}`}>{section.title}</Link>
{section.title && (
<>
{` / `}
<Link href={`/${section.id}`}>{section.title}</Link>
</>
)}
{category && (
<>
{category.id === 'ucg' ? null : (

View file

@ -106,11 +106,13 @@ function SidebarLink(props: SidebarContentLink) {
function SidebarSection({ title, url, children }: SidebarContentSectionLink) {
return (
<li className="sidebar__section">
<Link href={url}>
<div className="sidebar__link sidebar__section__title" data-active={false}>
{title}
</div>
</Link>
{title && (
<Link href={url}>
<div className="sidebar__link sidebar__section__title" data-active={false}>
{title}
</div>
</Link>
)}
<ul className="sidebar__list sidebar__section__list">
{children.map((link) => (
<SidebarLink key={link.url} {...link} />