mirror of
https://github.com/supabase/supabase.git
synced 2026-10-05 17:35:10 +03:00
Updates docusaurus
This commit is contained in:
Paul Copplestone committed
1 parent
b70d6f13d2
commit
3d94e1e8fa
6 files changed
+1030
-842
No files matched your search
Generated
+1028
-545
File diff suppressed because it is too large.
Load diff
+2
-2
@@ -9,8 +9,8 @@
|
||||
"traction": "node traction.js"
|
||||
},
|
||||
"dependencies": {
|
||||
"@docusaurus/core": "^2.0.0-alpha.61",
|
||||
"@docusaurus/preset-classic": "^2.0.0-alpha.61",
|
||||
"@docusaurus/core": "^2.0.0-alpha.62",
|
||||
"@docusaurus/preset-classic": "^2.0.0-alpha.62",
|
||||
"@kiwicopple/prism-react-renderer": "github:kiwicopple/prism-react-renderer",
|
||||
"classnames": "^2.2.6",
|
||||
"mermaid": "^8.6.4",
|
||||
|
||||
@@ -1,137 +0,0 @@
|
||||
/**
|
||||
* Copyright (c) 2017-present, Facebook, Inc.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import classnames from 'classnames';
|
||||
import {MDXProvider} from '@mdx-js/react';
|
||||
|
||||
import Link from '@docusaurus/Link';
|
||||
import MDXComponents from '@theme/MDXComponents';
|
||||
|
||||
import styles from './styles.module.css';
|
||||
|
||||
const MONTHS = [
|
||||
'January',
|
||||
'February',
|
||||
'March',
|
||||
'April',
|
||||
'May',
|
||||
'June',
|
||||
'July',
|
||||
'August',
|
||||
'September',
|
||||
'October',
|
||||
'November',
|
||||
'December',
|
||||
];
|
||||
|
||||
function BlogPostItem(props) {
|
||||
const {
|
||||
children,
|
||||
frontMatter,
|
||||
metadata,
|
||||
truncated,
|
||||
isBlogPostPage = false,
|
||||
} = props;
|
||||
const {date, permalink, tags} = metadata;
|
||||
const {author, title} = frontMatter;
|
||||
|
||||
const authorURL = frontMatter.author_url || frontMatter.authorURL;
|
||||
const authorTitle = frontMatter.author_title || frontMatter.authorTitle;
|
||||
const authorImageURL =
|
||||
frontMatter.author_image_url || frontMatter.authorImageURL;
|
||||
|
||||
const renderPostHeader = () => {
|
||||
const TitleHeading = isBlogPostPage ? 'h1' : 'h2';
|
||||
const match = date.substring(0, 10).split('-');
|
||||
const year = match[0];
|
||||
const month = MONTHS[parseInt(match[1], 10) - 1];
|
||||
const day = parseInt(match[2], 10);
|
||||
|
||||
return (
|
||||
<header>
|
||||
<TitleHeading
|
||||
className={classnames('margin-bottom--sm', styles.blogPostTitle)}>
|
||||
{isBlogPostPage ? title : <Link to={permalink}>{title}</Link>}
|
||||
</TitleHeading>
|
||||
<div className="margin-bottom--sm">
|
||||
<time dateTime={date} className={styles.blogPostDate}>
|
||||
{month} {day}, {year}
|
||||
</time>
|
||||
</div>
|
||||
<div className="avatar margin-bottom--md">
|
||||
{authorImageURL && (
|
||||
<a
|
||||
className="avatar__photo-link"
|
||||
href={authorURL}
|
||||
target="_blank"
|
||||
rel="noreferrer noopener">
|
||||
<img
|
||||
className="avatar__photo"
|
||||
src={authorImageURL}
|
||||
alt={author}
|
||||
/>
|
||||
</a>
|
||||
)}
|
||||
<div className="avatar__intro">
|
||||
{author && (
|
||||
<>
|
||||
<h4 className="avatar__name">
|
||||
<a href={authorURL} target="_blank" rel="noreferrer noopener">
|
||||
{author}
|
||||
</a>
|
||||
</h4>
|
||||
<small className="avatar__subtitle">{authorTitle}</small>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<article className={!isBlogPostPage ? 'margin-bottom--xl' : undefined}>
|
||||
{renderPostHeader()}
|
||||
<section className="markdown">
|
||||
<MDXProvider components={MDXComponents}>{children}</MDXProvider>
|
||||
</section>
|
||||
<section className="section" style={{ marginTop: 50, marginBottom: 50 }}>
|
||||
<a
|
||||
href="http://eepurl.com/gPWkwn"
|
||||
style={{width:'100%'}}
|
||||
className={'button hero--button button--md button--primary responsive-button'}
|
||||
>
|
||||
SUBSCRIBE TO OUR NEWSLETTER
|
||||
</a>
|
||||
</section>
|
||||
{(tags.length > 0 || truncated) && (
|
||||
<footer className="row margin-vert--lg">
|
||||
{tags.length > 0 && (
|
||||
<div className="col">
|
||||
<strong>Tags:</strong>
|
||||
{tags.map(({ label, permalink: tagPermalink }) => (
|
||||
<Link key={tagPermalink} className="margin-horiz--sm" to={tagPermalink}>
|
||||
{label}
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
{truncated && (
|
||||
<div className="col text--right">
|
||||
<Link to={metadata.permalink} aria-label={`Read more about ${title}`}>
|
||||
<strong>Read More</strong>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
</footer>
|
||||
)}
|
||||
</article>
|
||||
)
|
||||
}
|
||||
|
||||
export default BlogPostItem;
|
||||
@@ -1,14 +0,0 @@
|
||||
/**
|
||||
* Copyright (c) 2017-present, Facebook, Inc.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
.blogPostTitle {
|
||||
font-size: 3rem;
|
||||
}
|
||||
|
||||
.blogPostDate {
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
@@ -1,81 +0,0 @@
|
||||
/**
|
||||
* Copyright (c) 2017-present, Facebook, Inc.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
import React from 'react'
|
||||
|
||||
import Layout from '@theme/Layout'
|
||||
import BlogPostItem from '@theme/BlogPostItem'
|
||||
import BlogPostPaginator from '@theme/BlogPostPaginator'
|
||||
import useTOCHighlight from '@theme/hooks/useTOCHighlight'
|
||||
import styles from './styles.module.css'
|
||||
|
||||
const LINK_CLASS_NAME = 'contents__link'
|
||||
const ACTIVE_LINK_CLASS_NAME = 'contents__link--active'
|
||||
const TOP_OFFSET = 100
|
||||
|
||||
function DocTOC({ headings }) {
|
||||
useTOCHighlight(LINK_CLASS_NAME, ACTIVE_LINK_CLASS_NAME, TOP_OFFSET)
|
||||
return (
|
||||
<div className={styles.tableOfContents}>
|
||||
<div className="contents contents__left-border">
|
||||
<h4 className="title">Contents</h4>
|
||||
<Headings headings={headings} />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
/* eslint-disable jsx-a11y/control-has-associated-label */
|
||||
|
||||
function Headings({ headings, isChild }) {
|
||||
if (!headings.length) return null
|
||||
return (
|
||||
<ul className={isChild ? '' : ''}>
|
||||
{headings.map((heading) => (
|
||||
<li key={heading.id}>
|
||||
<a
|
||||
href={`#${heading.id}`}
|
||||
className={LINK_CLASS_NAME}
|
||||
dangerouslySetInnerHTML={{ __html: heading.value }}
|
||||
/>
|
||||
<Headings isChild headings={heading.children} />
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
|
||||
function BlogPostPage(props) {
|
||||
const { content: BlogPostContents } = props
|
||||
const { frontMatter, metadata } = BlogPostContents
|
||||
|
||||
return (
|
||||
<Layout title={metadata.title} description={metadata.description}>
|
||||
{BlogPostContents && (
|
||||
<div className="Blog container margin-vert--xl">
|
||||
<div className="row">
|
||||
<div className="col col--8 col--offset-1">
|
||||
<BlogPostItem frontMatter={frontMatter} metadata={metadata} isBlogPostPage>
|
||||
<BlogPostContents />
|
||||
</BlogPostItem>
|
||||
{(metadata.nextItem || metadata.prevItem) && (
|
||||
<div className="margin-vert--xl">
|
||||
<BlogPostPaginator nextItem={metadata.nextItem} prevItem={metadata.prevItem} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="col col--3">
|
||||
<DocTOC headings={BlogPostContents.rightToc} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</Layout>
|
||||
)
|
||||
}
|
||||
|
||||
export default BlogPostPage
|
||||
@@ -1,63 +0,0 @@
|
||||
/**
|
||||
* Copyright (c) 2017-present, Facebook, Inc.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
|
||||
.docTitle {
|
||||
font-size: 3rem;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 996px) {
|
||||
.docTitle {
|
||||
font-size: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.docItemContainer {
|
||||
margin: 0 auto;
|
||||
padding: 0 0.5rem;
|
||||
}
|
||||
|
||||
.tableOfContents {
|
||||
display: inherit;
|
||||
max-height: calc(100vh - (var(--ifm-navbar-height) + 2rem));
|
||||
overflow-y: auto;
|
||||
position: sticky;
|
||||
top: calc(var(--ifm-navbar-height) + 2rem);
|
||||
}
|
||||
|
||||
.tableOfContents::-webkit-scrollbar {
|
||||
width: 7px;
|
||||
}
|
||||
|
||||
.tableOfContents::-webkit-scrollbar-track {
|
||||
background: #f1f1f1;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.tableOfContents::-webkit-scrollbar-thumb {
|
||||
background: #888;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.tableOfContents::-webkit-scrollbar-thumb:hover {
|
||||
background: #555;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 996px) {
|
||||
.tableOfContents {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.docItemContainer {
|
||||
padding: 0 0.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.docLastUpdatedAt {
|
||||
font-weight: bold;
|
||||
}
|
||||
Reference in new issue
Block a user