chore(v2): lint website dir (#1073)

* chore(v2): lint website dir

* chore(v2): lint website dir

* fix CircleCI config
This commit is contained in:
Yangshun Tay 2018-10-27 12:01:10 -07:00 committed by GitHub
parent 40f620047a
commit d4458b394c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
17 changed files with 15860 additions and 435 deletions

View file

@ -17,51 +17,51 @@ const FEATURES = [
{
title: 'Powered by Markdown',
description: (
<p>
<>
Save time and focus on your projects documentation. Simply write docs
and blog posts with Markdown and Docusaurus will publish a set of static
html files ready to serve.
</p>
</>
),
icon: '/img/markdown.png',
},
{
title: 'Built Using React',
description: (
<p>
Extend or customize your project's layout by reusing React. Docusaurus
can be extended while reusing the same header and footer.
</p>
<>
Extend or customize your project&apos;s layout by reusing React.
Docusaurus can be extended while reusing the same header and footer.
</>
),
icon: '/img/react.svg',
},
{
title: 'Ready for Translations',
description: (
<p>
<>
Localization comes pre-configured. Use Crowdin to translate your docs
into over 70 languages.
</p>
</>
),
icon: '/img/translation.svg',
},
{
title: 'Document Versioning',
description: (
<p>
<>
Support users on all versions of your project. Document versioning helps
you keep documentation in sync with project releases.
</p>
</>
),
icon: '/img/versioning.svg',
},
{
title: 'Document Search',
description: (
<p>
<>
Make it easy for your community to find what they need in your
documentation. We proudly support Algolia documentation search.
</p>
</>
),
icon: '/img/search.svg',
},
@ -74,12 +74,13 @@ const QUOTES = [
title: 'Lead Prettier Developer',
text: (
<p>
I've helped open source many projects at Facebook and every one needed a
website. They all had very similar constraints: the documentation should
be written in markdown and be deployed via GitHub pages. None of the
existing solutions were great, so I hacked my own and then forked it
whenever we needed a new website. Im so glad that Docusaurus now exists
so that I dont have to spend a week each time spinning up a new one.
I&apos;ve helped open source many projects at Facebook and every one
needed a website. They all had very similar constraints: the
documentation should be written in markdown and be deployed via GitHub
pages. None of the existing solutions were great, so I hacked my own and
then forked it whenever we needed a new website. Im so glad that
Docusaurus now exists so that I dont have to spend a week each time
spinning up a new one.
</p>
),
},
@ -112,16 +113,19 @@ const QUOTES = [
function Home() {
const [featureIndex, setFeatureIndex] = useState(0);
useEffect(() => {
const timer = window.setInterval(() => {
setFeatureIndex(
prevFeatureIndex => (prevFeatureIndex + 1) % FEATURES.length,
);
}, FEATURE_INTERVAL);
return () => {
window.clearInterval(timer);
};
}, []);
useEffect(
() => {
const timer = window.setTimeout(() => {
setFeatureIndex(
prevFeatureIndex => (prevFeatureIndex + 1) % FEATURES.length,
);
}, FEATURE_INTERVAL);
return () => {
window.clearTimeout(timer);
};
},
[featureIndex],
);
return (
<div>
@ -137,12 +141,13 @@ function Home() {
Documentation websites
</h2>
<div className={styles.headerLinksContainer}>
<a className={styles.headerLink} href="">
<a className={styles.headerLink} href="/docs/installation">
Get Started
</a>
<a
className={classnames(styles.headerLink, styles.gitHubLink)}
href="https://github.com/facebook/docusaurus"
rel="noopener noreferrer"
target="_blank">
GitHub
</a>
@ -154,6 +159,7 @@ function Home() {
<div className={styles.sectionInner}>
<div className={styles.row}>
<div className={styles.column}>
<h2>Features</h2>
<ul className={styles.featureList}>
{FEATURES.map((feature, index) => (
<li
@ -162,14 +168,14 @@ function Home() {
onClick={() => {
setFeatureIndex(index);
}}>
<a
className={classnames(styles.featureListLink, {
[styles.featureListLinkSelected]:
<button
className={classnames(styles.featureListButton, {
[styles.featureListButtonSelected]:
index === featureIndex,
})}
role="button">
type="button">
{feature.title}
</a>
</button>
</li>
))}
</ul>
@ -180,7 +186,11 @@ function Home() {
return (
<div>
<div className={styles.featureIconContainer}>
<img className={styles.featureIcon} src={feature.icon} />
<img
alt={feature.title}
className={styles.featureIcon}
src={feature.icon}
/>
</div>
<h3 className={styles.featureTitle}>{feature.title}</h3>
<p>{feature.description}</p>
@ -201,7 +211,11 @@ function Home() {
<div className={styles.row}>
{QUOTES.map(quote => (
<div className={styles.column} key={quote.name}>
<img className={styles.quoteThumbnail} src={quote.thumbnail} />
<img
alt={quote.name}
className={styles.quoteThumbnail}
src={quote.thumbnail}
/>
<h3 className={styles.quoteName}>{quote.name}</h3>
<h4 className={styles.quoteTitle}>{quote.title}</h4>
<p className={styles.quoteText}>{quote.text}</p>