mirror of
https://github.com/status-im/react-native.git
synced 2025-02-11 08:56:44 +00:00
Summary: Several blog and sharing improvements are included in this update. * A larger default preview image is used when a blog post or doc is shared on social media as recommended by [best practices](https://developers.facebook.com/docs/sharing/best-practices#images). * Follow other Facebook Sharing best practices such as associating the site with a Facebook Page (React) and a Page Admin (121800083 is my fbid, and I am an admin for the React page). * If the shared blog post contains a hero image, use it as a share preview image. * Use actual doc content instead of generic site description when sharing docs. * Update existing hero images to use the larger recommended size. * Add titles to each author's byline. * Add author's avatar to their byline. * Add Twitter Card support. * Link to individual blog posts from the title and hero image in the blog index. Old metadata tags (blog post): ``` <meta property="og:title" content="Toward Better Documentation – React Native | A framework for building native Closes https://github.com/facebook/react-native/pull/9648 Differential Revision: D3790332 Pulled By: hramos fbshipit-source-id: 4f284c6440482df8a42a2b8467ccf56b1fd725d1
69 lines
2.3 KiB
JavaScript
69 lines
2.3 KiB
JavaScript
/**
|
|
* 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 DocsLayout
|
|
*/
|
|
|
|
var DocsSidebar = require('DocsSidebar');
|
|
var Header = require('Header');
|
|
var Footer = require('Footer');
|
|
var Marked = require('Marked');
|
|
var React = require('React');
|
|
var Site = require('Site');
|
|
var Metadata = require('Metadata');
|
|
|
|
var DocsLayout = React.createClass({
|
|
childContextTypes: {
|
|
permalink: React.PropTypes.string,
|
|
version: React.PropTypes.string
|
|
},
|
|
|
|
getChildContext: function() {
|
|
return {
|
|
permalink: this.props.metadata.permalink,
|
|
version: Metadata.config.RN_VERSION || 'next'
|
|
};
|
|
},
|
|
|
|
render: function() {
|
|
var metadata = this.props.metadata;
|
|
var content = this.props.children;
|
|
return (
|
|
<Site
|
|
section="docs"
|
|
title={metadata.title}
|
|
description={content.trim().split('\n')[0]} >
|
|
<section className="content wrap documentationContent">
|
|
<DocsSidebar metadata={metadata} />
|
|
<div className="inner-content">
|
|
<a id="content" />
|
|
<Header level={1}>{metadata.title}</Header>
|
|
<Marked>{content}</Marked>
|
|
<div className="docs-prevnext">
|
|
{metadata.previous && <a className="docs-prev" href={'docs/' + metadata.previous + '.html#content'}>← Prev</a>}
|
|
{metadata.next && <a className="docs-next" href={'docs/' + metadata.next + '.html#content'}>Next →</a>}
|
|
</div>
|
|
<Footer path={'docs/' + metadata.filename} />
|
|
<div className="survey">
|
|
<div className="survey-image" />
|
|
<p>
|
|
Recently, we have been working hard to make the documentation better based on your feedback. Your responses to this yes/no style survey will help us gauge whether we moved in the right direction with the improvements. Thank you!
|
|
</p>
|
|
<center>
|
|
<a className="button" href="https://www.facebook.com/survey?oid=516954245168428">Take Survey</a>
|
|
</center>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</Site>
|
|
);
|
|
}
|
|
});
|
|
|
|
module.exports = DocsLayout;
|