3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-08-06 10:20:09 +02:00
Code Issues Projects Releases Packages Wiki Activity

misc: default Docusaurus Website UX (#3455)

Browse source
This commit is contained in:
Joel Marcey 2020-09-15 19:15:45 -07:00 • committed by GitHub
parent 9bf4dfb275
commit ca8f3811b5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 52 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

113
website-1.x/pages/en/index.js
View file

@ -61,15 +61,6 @@ class Index extends React.Component {
return ( return (
<div> <div>
<div className="announcement">
<div className="announcement-inner">
Black Lives Matter.{' '}
<a href="https://support.eji.org/give/153413/#!/donation/checkout">
Support the Equal Justice Initiative
</a>
.
</div>
</div>
<HomeSplash siteConfig={siteConfig} language={language} /> <HomeSplash siteConfig={siteConfig} language={language} />
<div className="announcement"> <div className="announcement">
<div className="announcement-inner"> <div className="announcement-inner">
@ -84,69 +75,67 @@ class Index extends React.Component {
</div> </div>
</div> </div>
<div className="mainContainer"> <div className="mainContainer">
<div style={{marginTop: -40}}> <Container padding={['bottom', 'top']} background="light">
<Container padding={['bottom', 'top']} background="light"> <GridBlock
<GridBlock align="center"
align="center" contents={[
contents={[ {
{ content: `Save time and focus on your project's documentation. Simply
content: `Save time and focus on your project's documentation. Simply
write docs and blog posts with [Markdown](${siteConfig.baseUrl}docs/${this.props.language}/doc-markdown) write docs and blog posts with [Markdown](${siteConfig.baseUrl}docs/${this.props.language}/doc-markdown)
and Docusaurus will publish a set of static html files ready and Docusaurus will publish a set of static html files ready
to serve.`, to serve.`,
image: `${siteConfig.baseUrl}img/undraw_typewriter.svg`, image: `${siteConfig.baseUrl}img/undraw_typewriter.svg`,
imageAlign: 'top', imageAlign: 'top',
imageAlt: 'Markdown', imageAlt: 'Markdown',
title: <translate>Powered by Markdown</translate>, title: <translate>Powered by Markdown</translate>,
}, },
{ {
content: `[Extend or customize](${siteConfig.baseUrl}docs/${this.props.language}/api-pages) content: `[Extend or customize](${siteConfig.baseUrl}docs/${this.props.language}/api-pages)
your project's layout by reusing React. Docusaurus can be your project's layout by reusing React. Docusaurus can be
extended while reusing the same header and footer.`, extended while reusing the same header and footer.`,
image: `${siteConfig.baseUrl}img/undraw_react.svg`, image: `${siteConfig.baseUrl}img/undraw_react.svg`,
imageAlign: 'top', imageAlign: 'top',
imageAlt: 'React', imageAlt: 'React',
title: <translate>Built Using React</translate>, title: <translate>Built Using React</translate>,
}, },
{ {
content: `[Localization](${siteConfig.baseUrl}docs/${this.props.language}/translation) content: `[Localization](${siteConfig.baseUrl}docs/${this.props.language}/translation)
comes pre-configured. Use [Crowdin](https://crowdin.com/) to translate your docs comes pre-configured. Use [Crowdin](https://crowdin.com/) to translate your docs
into over 70 languages.`, into over 70 languages.`,
image: `${siteConfig.baseUrl}img/undraw_around_the_world.svg`, image: `${siteConfig.baseUrl}img/undraw_around_the_world.svg`,
imageAlign: 'top', imageAlign: 'top',
imageAlt: 'Translation', imageAlt: 'Translation',
title: <translate>Ready for Translations</translate>, title: <translate>Ready for Translations</translate>,
}, },
]} ]}
layout="threeColumn" layout="threeColumn"
/> />
<br /> <br />
<br /> <br />
<GridBlock <GridBlock
align="center" align="center"
contents={[ contents={[
{ {
content: `Support users on all versions of your project. Document content: `Support users on all versions of your project. Document
[versioning](${siteConfig.baseUrl}docs/${this.props.language}/versioning) [versioning](${siteConfig.baseUrl}docs/${this.props.language}/versioning)
helps you keep documentation in sync with project releases.`, helps you keep documentation in sync with project releases.`,
image: `${siteConfig.baseUrl}img/undraw_version_control.svg`, image: `${siteConfig.baseUrl}img/undraw_version_control.svg`,
imageAlign: 'top', imageAlign: 'top',
imageAlt: 'Document Versioning', imageAlt: 'Document Versioning',
title: <translate>Document Versioning</translate>, title: <translate>Document Versioning</translate>,
}, },
{ {
content: `Make it easy for your community to [find](${siteConfig.baseUrl}docs/${this.props.language}/search) what they need in your documentation. content: `Make it easy for your community to [find](${siteConfig.baseUrl}docs/${this.props.language}/search) what they need in your documentation.
We proudly support [Algolia documentation search](https://www.algolia.com/).`, We proudly support [Algolia documentation search](https://www.algolia.com/).`,
image: `${siteConfig.baseUrl}img/undraw_algolia.svg`, image: `${siteConfig.baseUrl}img/undraw_algolia.svg`,
imageAlign: 'top', imageAlign: 'top',
imageAlt: 'Document Search', imageAlt: 'Document Search',
title: <translate>Document Search</translate>, title: <translate>Document Search</translate>,
}, },
]} ]}
layout="twoColumn" layout="twoColumn"
/> />
</Container> </Container>
</div>
<Container padding={['bottom', 'top']}> <Container padding={['bottom', 'top']}>
<GridBlock <GridBlock
contents={[ contents={[

2
website-1.x/static/css/custom.css
View file

@ -64,7 +64,7 @@ table td:first-child > code {
font-weight: bold; font-weight: bold;
font-size: 24px; font-size: 24px;
padding: 48px; padding: 48px;
margin: 0 auto; margin: 0 auto -40px;
text-align: center; text-align: center;
} }

9
website/src/pages/index.js
View file

@ -68,15 +68,6 @@ function Home() {
title={tagline} title={tagline}
description={customFields.description}> description={customFields.description}>
<main> <main>
<div className={clsx(styles.announcement, styles.announcementDark)}>
<div className={styles.announcementInner}>
Black Lives Matter.{' '}
<Link to="https://support.eji.org/give/153413/#!/donation/checkout">
Support the Equal Justice Initiative
</Link>
.
</div>
</div>
<div className={styles.hero}> <div className={styles.hero}>
<div className={styles.heroInner}> <div className={styles.heroInner}>
<h1 className={styles.heroProjectTagline}> <h1 className={styles.heroProjectTagline}>