tldraw/apps/docs/components/Footer.tsx
Steve Ruiz 9a6f4e8c4b
[docs] design shuffle (#2951)
This PR incorporates design tweaks from #2922 without the home page or
content changes.

These are:
- Replacing all `hello@tldraw.com` with `sales@tldraw.com`
- Fix mailto links.
- Showing the first item in a section on direct routes to the section
- Splitting the article page for human-written content from article page
for generated content
- Splitting the layout for the landing page from the rest of the site
(temporarily identical to the regular content)
- Removing headings from left sidebar
- Restoring headings in right sidebar for human-written pages with > 1
heading link
- Styling block quote
- Adjusting section link appearance / layout in header / menu
- Changing the order of search results to preference docs over examples
- Updating copy on events
- Removing copy on user interface menus
- Adding hero as prop to all articles
- Updated icon
- Fixing a few broken links
- Replaces the sandpack code blocks with hljs code blocks, except in
examples.

### Change Type

- [x] `documentation` — Changes to the documentation only[^2]
2024-02-29 16:28:45 +00:00

41 lines
1 KiB
TypeScript

import dynamic from 'next/dynamic'
import { Icon } from './Icon'
const FancyBox = dynamic(async () => await import('./FancyBox'), { ssr: false })
export function Footer() {
return (
<div className="footer">
<FancyBox />
<a className="footer__lockup" href="https://tldraw.com">
<span
className="footer__lockup__icon"
style={{
mask: `url(/tldraw-icon.svg) center 100% / 100% no-repeat`,
WebkitMask: `url(/tldraw-icon.svg) center 100% / 100% no-repeat`,
}}
/>
<p>tldraw © {new Date().getFullYear()}</p>
</a>
<div className="footer__socials">
<a href="https://x.com/tldraw" className="sidebar__button icon-button" title="x">
<Icon icon="twitter" />
</a>
<a
href="https://github.com/tldraw/tldraw"
className="sidebar__button icon-button"
title="github"
>
<Icon icon="github" />
</a>
<a
href="https://discord.com/invite/SBBEVCA4PG"
className="sidebar__button icon-button"
title="discord"
>
<Icon icon="discord" />
</a>
</div>
</div>
)
}