3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-05-11 08:07:26 +02:00
Code Issues Projects Releases Packages Wiki Activity

feat(v2): official CodeSandbox support (#3717)

Browse source 
* feat:added support for codesandbox

* added sandbox config file

* feat:added script to generate template for codesandbox

* added examples:generate script to package.json file

* added failing path to eslintignore

* added script to eslintignore

* added cleaning feature to script

* deleted sandbox script in root

* changed comment in codesandboxscript file

* update codesandboxscript.js + revert bad package.json changes

* eslint should check codesandboxscript

Co-authored-by: slorber <lorber.sebastien@gmail.com>
This commit is contained in:
sammychinedu2ky 2020-11-16 16:20:16 +01:00 • committed by GitHub
parent 5f20200661
commit bb33f54ba8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
81 changed files with 34788 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

111
examples/facebook/src/pages/index.js Normal file
View file

@ -0,0 +1,111 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
*/
import React from 'react';
import clsx from 'clsx';
import Layout from '@theme/Layout';
import Link from '@docusaurus/Link';
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
import useBaseUrl from '@docusaurus/useBaseUrl';
import styles from './styles.module.css';
const features = [
{
title: 'Easy to Use',
imageUrl: 'img/undraw_docusaurus_mountain.svg',
description: (
<>
Docusaurus was designed from the ground up to be easily installed and
used to get your website up and running quickly.
</>
),
},
{
title: 'Focus on What Matters',
imageUrl: 'img/undraw_docusaurus_tree.svg',
description: (
<>
Docusaurus lets you focus on your docs, and we&apos;ll do the chores. Go
ahead and move your docs into the <code>docs</code> directory.
</>
),
},
{
title: 'Powered by React',
imageUrl: 'img/undraw_docusaurus_react.svg',
description: (
<>
Extend or customize your website layout by reusing React. Docusaurus can
be extended while reusing the same header and footer.
</>
),
},
];
function Feature({imageUrl, title, description}) {
const imgUrl = useBaseUrl(imageUrl);
return (
<div className={clsx('col col--4', styles.feature)}>
{imgUrl && (
<div className="text--center">
<img className={styles.featureImage} src={imgUrl} alt={title} />
</div>
)}
<h3>{title}</h3>
<p>{description}</p>
</div>
);
}
function Home() {
const context = useDocusaurusContext();
const {siteConfig = {}} = context;
return (
<Layout
title={`Hello from ${siteConfig.title}`}
description="Description will go into a meta tag in <head />">
<header className={clsx('hero hero--primary', styles.heroBanner)}>
<div className="container">
<h1 className="hero__title">{siteConfig.title}</h1>
<p className="hero__subtitle">{siteConfig.tagline}</p>
<div className={styles.buttons}>
<Link
className={clsx(
'button button--outline button--secondary button--lg',
styles.getStarted,
)}
to={useBaseUrl('docs/')}>
Get Started
</Link>
</div>
</div>
</header>
<main>
{features && features.length > 0 && (
<section className={styles.features}>
<div className="container">
<div className="row">
{features.map(({title, imageUrl, description}) => (
<Feature
key={title}
title={title}
imageUrl={imageUrl}
description={description}
/>
))}
</div>
</div>
</section>
)}
</main>
</Layout>
);
}
export default Home;