Enable stylesheets as a parallel to scripts (#225)

* Enable stylesheets as a parallel to scripts

Also moves the scripts above the custom stylesheet to follow the comment :)

* Update api-site-config.md
This commit is contained in:
Christopher Chedeau 2017-11-13 17:54:24 -08:00 committed by Joel Marcey
parent 856ca785e5
commit c407cdf96f
2 changed files with 16 additions and 8 deletions

View file

@ -100,6 +100,8 @@ customDocsPath: "website-docs"
`scripts` - Array of JavaScript sources to load. The script tag will be inserted in the HTML head. `scripts` - Array of JavaScript sources to load. The script tag will be inserted in the HTML head.
`stylesheets` - Array of CSS sources to load. The link tag will be inserted in the HTML head.
`cname` - The CNAME for your website. It will go into a `CNAME` file when your site it built. `cname` - The CNAME for your website. It will go into a `CNAME` file when your site it built.
Users can also add their own custom fields if they wish to provide some data across different files. Users can also add their own custom fields if they wish to provide some data across different files.
@ -162,7 +164,8 @@ const siteConfig = {
} }
} }
], ],
scripts: [ "https://docusaurus.io/slash.js" ] scripts: [ "https://docusaurus.io/slash.js" ],
stylesheets: [ "https://docusaurus.io/style.css" ]
}; };

View file

@ -22,8 +22,6 @@ class Head extends React.Component {
const highlightVersion = highlightConfig.version || highlightDefaultVersion; const highlightVersion = highlightConfig.version || highlightDefaultVersion;
const highlightTheme = highlightConfig.theme || 'default'; const highlightTheme = highlightConfig.theme || 'default';
const hasCustomScripts = this.props.config.scripts;
return ( return (
<head> <head>
<meta charSet="utf-8" /> <meta charSet="utf-8" />
@ -79,16 +77,23 @@ class Head extends React.Component {
/> />
)} )}
{/* External resources */}
{this.props.config.stylesheets && this.props.config.stylesheets.map(function(source) {
return (
<link rel="stylesheet" href={source} />
);
})}
{this.props.config.scripts && this.props.config.scripts.map(function(source) {
return (
<script type="text/javascript" src={source} />
);
})}
{/* Site defined code. Keep these at the end to avoid overriding. */} {/* Site defined code. Keep these at the end to avoid overriding. */}
<link <link
rel="stylesheet" rel="stylesheet"
href={this.props.config.baseUrl + "css/main.css"} href={this.props.config.baseUrl + "css/main.css"}
/> />
{hasCustomScripts && this.props.config.scripts.map(function(source) {
return (
<script type="text/javascript" src={source} />
);
})}
</head> </head>
); );
} }