diff --git a/docs/guides-custom-pages.md b/docs/guides-custom-pages.md index 2b56549e5a..0facee2b91 100644 --- a/docs/guides-custom-pages.md +++ b/docs/guides-custom-pages.md @@ -3,7 +3,7 @@ id: custom-pages title: Custom Pages --- -You can add pages to your site that are not part of the standard docs or blog markdown files. You can do this by adding `.js` files to the `website/pages` directory. These files are React components and the `render()` is called to create them, backed by CSS classes, etc. +You can add pages to your site that are not part of the standard docs or blog markdown files. You can do this by adding `.js` files to the `website/pages` directory. These files are [React](https://facebook.github.io/react) components and the `render()` is called to create them, backed by CSS classes, etc. ## Customizing Your Home Page @@ -35,6 +35,8 @@ root-of-repo Of course, you are also free to write your own pages. It is strongly suggested that you at least have an index page, but none of the pages provided are mandatory to include in your site. More information on how to use the provided components or include your own can be found [here](api-pages.md). Information on how to link to your different pages in the header navigation bar can be found [here](guides-navigation.md). +> If you want your page to show up in your navigation header, you will need to update `siteConfig.js` to add to the `headerLinks` element. e.g., `{ page: "about-slash", label: "About/"}`, + ## Adding Static Pages Static `.html` files can also be used, but they will not include Docusaurus's header, footer, or styles by default. These can be added to the `static` folder in the same way as other [static assets](api-pages.md#using-static-assets). Alternatively, they can be placed in the `pages` folder and would be served as-is instead of being rendered from React. diff --git a/website/pages/en/about-slash.js b/website/pages/en/about-slash.js new file mode 100644 index 0000000000..3b08cccce0 --- /dev/null +++ b/website/pages/en/about-slash.js @@ -0,0 +1,44 @@ +/** + * Copyright (c) 2017-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ + +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"); + +class AboutSlash extends React.Component { + render() { + return ( +
+ +

About Slash

+ +

+ Slash is the official mascot of Docusaurus. You will find different variations of her throughout the website, whether she is moving fast on her scooter or writing documentation at her standing desk. At Facebook, we have actual Slash plushies -- and you never know, you may see these plushies at various events and conferences in the future. +

+
+ +

Birth of Slash

+ +

+ The team sat in a conference room trying to come up with a name for the project. Dinosaurs became a theme, finally landing on Docusaurus, combining documentation with those many dinosaurus that end in "saurus". Of course, we needed a logo for our new project. Eric sat down and designed a logo that was quite beyond the norm of our normal open source project logos, but yet was just so awesome, we had to use it. We needed a name for this cute Docusaur. "Marky" for markdown? "Docky" for documentation? No, "Slash" for the normal way someone starts code documentation in many programming languages // or /* or ///. And Slash was born. +

+
+
+
+ ); + } +} + +AboutSlash.defaultProps = { + language: "en" +}; + +module.exports = AboutSlash; diff --git a/website/siteConfig.js b/website/siteConfig.js index e68ba97921..a72872ea15 100644 --- a/website/siteConfig.js +++ b/website/siteConfig.js @@ -78,6 +78,7 @@ const siteConfig = { headerLinks: [ { doc: "installation", label: "Docs" }, { page: "help", label: "Help" }, + { page: "about-slash", label: "About/"}, { blog: true, label: "Blog" }, { href: "https://github.com/facebook/docusaurus", diff --git a/website/static/img/slash-birth.png b/website/static/img/slash-birth.png new file mode 100644 index 0000000000..070bc53f80 Binary files /dev/null and b/website/static/img/slash-birth.png differ