CSS revamp - Improve typography and overall styling (#757)

* Improve CSS code

* Fix blog layout

* Fix

* Refactor onPageNav

* More fixes

* Fix docs nav

* Use alternative hack

* Tweak clearfix
This commit is contained in:
Yangshun Tay 2018-06-19 21:46:15 -07:00 committed by GitHub
parent 169a5e6ded
commit 1094dbd352
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 1474 additions and 1114 deletions

View file

@ -5,40 +5,37 @@
* LICENSE file in the root directory of this source tree.
*/
const React = require("react");
const CompLibrary = require("../../core/CompLibrary.js");
const React = require('react');
const CompLibrary = require('../../core/CompLibrary.js');
const Container = CompLibrary.Container;
const GridBlock = CompLibrary.GridBlock;
const siteConfig = require(process.cwd() + "/siteConfig.js");
const translate = require("../../server/translate.js").translate;
const siteConfig = require(process.cwd() + '/siteConfig.js');
const translate = require('../../server/translate.js').translate;
class Help extends React.Component {
render() {
const supportLinks = [
{
title: <translate>Browse the docs</translate>,
content: (
`Learn more about Docusaurus using the [official documentation](${siteConfig.baseUrl}docs/${this.props.language}/installation).`
),
content: `Learn more about Docusaurus using the [official documentation](${
siteConfig.baseUrl
}docs/${this.props.language}/installation).`,
},
{
title: <translate>Discord</translate>,
content: (
"You can join the conversation on [Discord](https://discord.gg/docusaurus) on one of our two text channels: #docusaurus-users for user help and #docusaurus-dev for contributing help."
),
content:
'You can join the conversation on [Discord](https://discord.gg/docusaurus) on one of our two text channels: #docusaurus-users for user help and #docusaurus-dev for contributing help.',
},
{
title: <translate>Twitter</translate>,
content: (
"You can follow and contact us on [Twitter](https://twitter.com/docusaurus)."
),
content:
'You can follow and contact us on [Twitter](https://twitter.com/docusaurus).',
},
{
title: <translate>GitHub</translate>,
content: (
"At our [GitHub repo](https://github.com/facebook/docusaurus) Browse and submit [issues](https://github.com/facebook/Docusaurus/issues) or [pull requests](https://github.com/facebook/Docusaurus/pulls) for bugs you find or any new features you may want implemented. Be sure to also check out our [contributing information](https://github.com/facebook/Docusaurus/blob/master/CONTRIBUTING.md)."
),
}
content:
'At our [GitHub repo](https://github.com/facebook/docusaurus) Browse and submit [issues](https://github.com/facebook/Docusaurus/issues) or [pull requests](https://github.com/facebook/Docusaurus/pulls) for bugs you find or any new features you may want implemented. Be sure to also check out our [contributing information](https://github.com/facebook/Docusaurus/blob/master/CONTRIBUTING.md).',
},
];
return (
@ -46,11 +43,14 @@ class Help extends React.Component {
<Container className="mainContainer documentContainer postContainer">
<div className="post">
<header className="postHeader">
<h2><translate>Need help?</translate></h2>
<h1>
<translate>Need help?</translate>
</h1>
</header>
<p>
<translate desc="statement made to reader">
If you need help with Docusaurus, you can try one of the mechanisms below.
If you need help with Docusaurus, you can try one of the
mechanisms below.
</translate>
</p>
<GridBlock contents={supportLinks} layout="fourColumn" />