diff --git a/website/core/HeaderWithGithub.js b/website/core/HeaderWithGithub.js new file mode 100644 index 000000000..7304caad4 --- /dev/null +++ b/website/core/HeaderWithGithub.js @@ -0,0 +1,40 @@ +/** + * Copyright (c) 2015-present, Facebook, Inc. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. An additional grant + * of patent rights can be found in the PATENTS file in the same directory. + * + * @providesModule HeaderWithGithub + */ + +var H = require('Header'); +var React = require('React'); + +var HeaderWithGithub = React.createClass({ + render: function() { + return ( + + + + + + + +
+ + {this.props.title} + + + + Edit on GitHub + +
+ ); + } +}); + +module.exports = HeaderWithGithub; diff --git a/website/layout/AutodocsLayout.js b/website/layout/AutodocsLayout.js index c5dbb5445..e0b493ae1 100644 --- a/website/layout/AutodocsLayout.js +++ b/website/layout/AutodocsLayout.js @@ -12,6 +12,7 @@ var DocsSidebar = require('DocsSidebar'); var H = require('Header'); var Header = require('Header'); +var HeaderWithGithub = require('HeaderWithGithub'); var Marked = require('Marked'); var Prism = require('Prism'); var React = require('React'); @@ -233,10 +234,7 @@ var ComponentDoc = React.createClass({ {content.description} - + Props {this.renderProps(content.props, content.composes)} ); @@ -406,32 +404,45 @@ var APIDoc = React.createClass({ } }); -var HeaderWithGithub = React.createClass({ - - renderRunnableLink: function() { - if (this.props.metadata && this.props.metadata.runnable) { - return ( - - Run this example - - ); - } - }, - +var EmbeddedSimulator = React.createClass({ render: function() { + if (!this.props.shouldRender) { + return null; + } + + var metadata = this.props.metadata; + return ( - - - Edit on GitHub - - {this.renderRunnableLink()} - {this.props.title} - +
+

Run this example

+
+ Run example in simulator +
+ +
+ ); + } +}); + +var Modal = React.createClass({ + render: function() { + var appParams = {route: 'AlertIOS'}; + var encodedParams = encodeURIComponent(JSON.stringify(appParams)); + var url = `https://appetize.io/embed/bypdk4jnjra5uwyj2kzd2aenv4?device=iphone5s&scale=70&autoplay=false&orientation=portrait&deviceColor=white¶ms=${encodedParams}`; + + return ( +
+
+
+ +
+ +

Powered by appetize.io

+
+
+
+
+
); } }); @@ -486,7 +497,11 @@ var Autodocs = React.createClass({
-

{metadata.title}

+ {content} {this.renderFullDescription(docs)} {this.renderExample(docs, metadata)} @@ -504,47 +519,4 @@ var Autodocs = React.createClass({ } }); -var EmbeddedSimulator = React.createClass({ - render: function() { - if (!this.props.shouldRender) { - return null; - } - - var metadata = this.props.metadata; - - return ( -
-

Run this example

-
- Run example in simulator -
- -
- ); - } -}); - -var Modal = React.createClass({ - render: function() { - var appParams = {route: 'AlertIOS'}; - var encodedParams = encodeURIComponent(JSON.stringify(appParams)); - var url = `https://appetize.io/embed/bypdk4jnjra5uwyj2kzd2aenv4?device=iphone5s&scale=70&autoplay=false&orientation=portrait&deviceColor=white¶ms=${encodedParams}`; - - return ( -
-
-
- -
- -

Powered by appetize.io

-
-
-
-
-
- ); - } -}); - module.exports = Autodocs; diff --git a/website/layout/DocsLayout.js b/website/layout/DocsLayout.js index b0cb69066..673496938 100644 --- a/website/layout/DocsLayout.js +++ b/website/layout/DocsLayout.js @@ -9,10 +9,12 @@ * @providesModule DocsLayout */ +var DocsSidebar = require('DocsSidebar'); +var HeaderWithGithub = require('HeaderWithGithub'); +var Marked = require('Marked'); var React = require('React'); var Site = require('Site'); -var Marked = require('Marked'); -var DocsSidebar = require('DocsSidebar'); + var DocsLayout = React.createClass({ render: function() { var metadata = this.props.metadata; @@ -23,14 +25,11 @@ var DocsLayout = React.createClass({
-

- {metadata.title} - - Edit on GitHub - -

+ {content}
{metadata.previous && ← Prev} diff --git a/website/server/extractDocs.js b/website/server/extractDocs.js index 939e78018..2f88d9bfe 100644 --- a/website/server/extractDocs.js +++ b/website/server/extractDocs.js @@ -137,6 +137,7 @@ function componentsToMarkdown(type, json, filepath, i, styles) { 'next: ' + next, 'sidebar: ' + shouldDisplayInSidebar(componentName), 'runnable:' + isRunnable(componentName), + 'path:' + json.filepath, '---', JSON.stringify(json, null, 2), ].filter(function(line) { return line; }).join('\n'); diff --git a/website/src/react-native/css/react-native.css b/website/src/react-native/css/react-native.css index 1331e880f..83cf44113 100644 --- a/website/src/react-native/css/react-native.css +++ b/website/src/react-native/css/react-native.css @@ -1118,18 +1118,6 @@ div[data-twttr-id] iframe { margin-left: 26px; } -.edit-github { - font-size: 15px; - font-weight: normal; - float: right; -} - -.run-example { - font-size: 15px; - float: right; - margin-right: 20px; -} - #content { display: none; }