[website] Tweak homepage layout
This commit is contained in:
parent
b1a84f711c
commit
7f84c3d7b2
|
@ -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>
|
||||
);
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue