[website] Tweak homepage layout

This commit is contained in:
Ben Alpert 2015-03-25 19:17:49 -07:00
parent b1a84f711c
commit 7f84c3d7b2
2 changed files with 16 additions and 8 deletions

View File

@ -25,11 +25,12 @@ var index = React.createClass({
</div>
<section className="content wrap">
<section className="home-bottom-section">
<div className="buttons-unit">
<a href="docs/getting-started.html#content" className="button">Learn more about React Native</a>
<a href="docs/getting-started.html#content" className="button">Get started with React Native</a>
</div>
</section>
<div style={{margin: '60px auto', width: 800}}>
<h2>Native iOS Components</h2>
<p>
@ -55,7 +56,7 @@ module.exports = React.createClass({
<p>
All operations between the JavaScript application code and the native platform are performed asynchronously, and the native modules can also make use of additional threads as well. This means we can decode images off of the main thread, save to disk in the background, measure text and compute layouts without blocking the UI, and more. As a result, React Native apps are naturally fluid and responsive. The communication is also fully serializable, which allows us to leverage Chrome Developer Tools to debug JS while running the app in the full app environment, in the sim or on a real device.
</p>
<img src="/react-native/img/chrome_breakpoint.png" width="800"/>
<img src="/react-native/img/chrome_breakpoint.png" width="800" height="606" />
<h2>Touch Handling</h2>
<p>
@ -141,6 +142,13 @@ module.exports = React.createClass({
},
});`}
</Prism>
</div>
<section className="home-bottom-section">
<div className="buttons-unit">
<a href="docs/getting-started.html#content" className="button">Get started with React Native</a>
</div>
</section>
</section>
</Site>
);

View File

@ -324,7 +324,7 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
}
.buttons-unit {
margin-top: 60px;
margin-top: 40px;
text-align: center;
}
@ -576,7 +576,7 @@ section.black content {
font-size: 24px;
}
.documentationContent h2 {
h2 {
margin-top: 30px;
}