diff --git a/blog/2016-03-24-introducing-hot-reloading.md b/blog/2016-03-24-introducing-hot-reloading.md index 06c6ba890d1..8ddad23affe 100644 --- a/blog/2016-03-24-introducing-hot-reloading.md +++ b/blog/2016-03-24-introducing-hot-reloading.md @@ -5,6 +5,7 @@ authorTitle: Software Engineer at Instagram authorURL: https://twitter.com/martinbigio authorImage: https://avatars3.githubusercontent.com/u/535661?v=3&s=128 authorTwitter: martinbigio +category: announcements --- React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grows. diff --git a/blog/2016-07-06-toward-better-documentation.md b/blog/2016-07-06-toward-better-documentation.md index ee14a56bc0c..854887d6d1f 100644 --- a/blog/2016-07-06-toward-better-documentation.md +++ b/blog/2016-07-06-toward-better-documentation.md @@ -5,6 +5,7 @@ authorTitle: Engineering Manager at Facebook authorURL: https://twitter.com/lacker authorImage: http://www.gravatar.com/avatar/9b790592be15d4f55a5ed7abb5103304?s=128 authorTwitter: lacker +category: announcements --- Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better based on your feedback, and we wanted to share some of the improvements we've made. diff --git a/blog/2016-08-12-react-native-meetup-san-francisco.md b/blog/2016-08-12-react-native-meetup-san-francisco.md index fec971d2ef9..53ece48f78b 100644 --- a/blog/2016-08-12-react-native-meetup-san-francisco.md +++ b/blog/2016-08-12-react-native-meetup-san-francisco.md @@ -6,6 +6,7 @@ authorURL: https://twitter.com/hectorramos authorImage: https://s.gravatar.com/avatar/f2223874e66e884c99087e452501f2da?s=128 authorTwitter: hectorramos hero: /react-native/blog/img/rnmsf-august-2016-hero.jpg +category: events --- Last week I had the opportunity to attend the [React Native Meetup](http://www.meetup.com/React-Native-San-Francisco/photos/27168649/#452793854) at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet other developers near me that are also interested in React Native. diff --git a/blog/2016-08-19-right-to-left-support-for-react-native-apps.md b/blog/2016-08-19-right-to-left-support-for-react-native-apps.md index 15f01e824e3..09a5fdb78c5 100644 --- a/blog/2016-08-19-right-to-left-support-for-react-native-apps.md +++ b/blog/2016-08-19-right-to-left-support-for-react-native-apps.md @@ -4,6 +4,7 @@ author: Mengjue (Mandy) Wang authorTitle: Software Engineer Intern at Facebook authorURL: https://github.com/MengjueW authorImage: https://avatars0.githubusercontent.com/u/13987140?v=3&s=128 +category: engineering --- After launching an app to the app stores, internationalization is the next step to further your audience reach. Over 20 countries and numerous people around the world use Right-to-Left (RTL) languages. Thus, making your app support RTL for them is necessary. diff --git a/website/core/BlogPost.js b/website/core/BlogPost.js index 5f05036818a..8fdf40dd164 100644 --- a/website/core/BlogPost.js +++ b/website/core/BlogPost.js @@ -15,7 +15,7 @@ var Marked = require('Marked'); var React = require('React'); var BlogPostHeader = require('BlogPostHeader'); var BlogPostFooter = require('BlogPostFooter'); -var ReadMoreLink = require('ReadMoreLink'); +var ExcerptLink = require('ExcerptLink'); var BlogPost = React.createClass({ render: function() { @@ -37,7 +37,7 @@ var BlogPost = React.createClass({ if (this.props.excerpt) { content = content.trim().split('\n')[0]; - footer = ; + footer = ; } return ( diff --git a/website/core/BlogPostHeader.js b/website/core/BlogPostHeader.js index ceb3012c1ad..0dd3c45e165 100644 --- a/website/core/BlogPostHeader.js +++ b/website/core/BlogPostHeader.js @@ -29,6 +29,14 @@ var BlogPostHeader = React.createClass({ hero = {hero}; } + if (post.youtube_video) { + hero =
+ +
; + } + return (
{hero} diff --git a/website/core/ReadMoreLink.js b/website/core/ExcerptLink.js similarity index 70% rename from website/core/ReadMoreLink.js rename to website/core/ExcerptLink.js index 27a372789a2..7a0ab14f7fc 100644 --- a/website/core/ReadMoreLink.js +++ b/website/core/ExcerptLink.js @@ -6,23 +6,29 @@ * 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 ReadMoreLink + * @providesModule ExcerptLink */ 'use strict'; var React = require('React'); -var ReadMoreLink = React.createClass({ +var ExcerptLink = React.createClass({ render: function() { + var cta = "Read more"; + + if (this.props.category === "videos") { + cta = "Watch video"; + } + return ( ); } }); -module.exports = ReadMoreLink; +module.exports = ExcerptLink; diff --git a/website/src/react-native/css/react-native.css b/website/src/react-native/css/react-native.css index fe765b09d39..e2601c66d8c 100644 --- a/website/src/react-native/css/react-native.css +++ b/website/src/react-native/css/react-native.css @@ -1793,3 +1793,22 @@ article li { .btn:hover { text-decoration: none !important; } + +.video-container { + border-radius: 4px; + background-clip: padding-box; + margin: 0 0 18px; + height: 180px; + width: 100%; + background-size: cover; + background-position: center center; + position: relative; + height: 0; + overflow: hidden; +} + +@media (min-width: 760px) { + .video-container { + height: 345px; + } +}