3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-05-10 23:57:22 +02:00
Code Issues Projects Releases Packages Wiki Activity

Add more details on configurable fonts (#409)

Browse source
This commit is contained in:
Joel Marcey 2018-01-21 20:10:04 -08:00 • committed by GitHub
parent a241a46669
commit edbb869e26
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 37 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

27
docs/api-site-config.md
View file

@ -62,7 +62,6 @@ headerLinks: [
### Optional Fields ### Optional Fields
`fonts` - Font-family css configuration for the site. If a font family specified as `$myFont`, then adding a `myFont` key to an array in `fonts` will allow you to configure the font. Items appearing earlier in the array will take priority of later elements, so these should be more specific.
`customDocsPath` - By default, Docusaurus expects your documentation to be in a directory called `docs`. This directory is at the same level as the `website` directory (i.e., not inside the `website` directory). You can specify a custom path to your documentation with this field. **Note that all of your documentation *.md files must still reside in a flat hierarchy. You cannot have your documents in nested directories**. `customDocsPath` - By default, Docusaurus expects your documentation to be in a directory called `docs`. This directory is at the same level as the `website` directory (i.e., not inside the `website` directory). You can specify a custom path to your documentation with this field. **Note that all of your documentation *.md files must still reside in a flat hierarchy. You cannot have your documents in nested directories**.
```js ```js
@ -72,6 +71,32 @@ customDocsPath: "docs/site"
```js ```js
customDocsPath: "website-docs" customDocsPath: "website-docs"
``` ```
`fonts` - Font-family css configuration for the site. If a font family is specified in `siteConfig.js` as `$myFont`, then adding a `myFont` key to an array in `fonts` will allow you to configure the font. Items appearing earlier in the array will take priority of later elements, so ordering of the fonts matter.
In the below example, we have two sets of font configurations, `myFont` and `myOtherFont`. `Times New Roman` is the preferred font in `myFont`. `-apple-system` is the preferred in `myOtherFont`.
```
fonts: {
myFont: [
"Times New Roman",
"Serif"
],
myOtherFont: [
"-apple-system",
"system-ui"
]
},
```
The above fonts would be represented in your CSS file(s) as variables `$myFont` and `$myOtherFont`.
```
h1 {
font-family: $myFont;
}
```
`useEnglishUrl` - If you do not have [translations](guides-translation.md) enabled (e.g., by having a `languages.js` file), but still want a link of the form `/docs/en/doc.html` (with the `en`), set this to `true`. `useEnglishUrl` - If you do not have [translations](guides-translation.md) enabled (e.g., by having a `languages.js` file), but still want a link of the form `/docs/en/doc.html` (with the `en`), set this to `true`.
`organizationName` - GitHub username of the organization or user hosting this project. This is used by the publishing script to determine where your GitHub pages website will be hosted. `organizationName` - GitHub username of the organization or user hosting this project. This is used by the publishing script to determine where your GitHub pages website will be hosted.

11
examples/basics/siteConfig.js
View file

@ -37,6 +37,17 @@ const siteConfig = {
primaryColor: '#2E8555', primaryColor: '#2E8555',
secondaryColor: '#205C3B', secondaryColor: '#205C3B',
}, },
/* custom fonts for website */
/*fonts: {
myFont: [
"Times New Roman",
"Serif"
],
myOtherFont: [
"-apple-system",
"system-ui"
]
},*/
// This copyright info is used in /core/Footer.js and blog rss/atom feeds. // This copyright info is used in /core/Footer.js and blog rss/atom feeds.
copyright: copyright:
'Copyright © ' + 'Copyright © ' +