status-im
/
react-native
mirror of https://github.com/status-im/react-native.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Fix button spacing and layout on small screens 

Summary:
<!--
Thank you for sending the PR! We appreciate you spending the time to work on these changes.

Help us understand your motivation by explaining why you decided to make this change.

You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html

Happy contributing!

-->

Fix buttons issue in small screens

Before:

![image](https://user-images.githubusercontent.com/3904240/29141530-3b5697a0-7d57-11e7-964a-049fb3568bf2.png)

After:

![image](https://user-images.githubusercontent.com/3904240/29141557-67c2780e-7d57-11e7-8e25-c3a8a3f39bc6.png)
Closes https://github.com/facebook/react-native/pull/15437

Differential Revision: D5666978

Pulled By: TheSavior

fbshipit-source-id: 8f2521f4aa5b788f1e6d2743beadb4ac7c2b37cf
This commit is contained in:
Alexander Mykolaichuk 2017-08-19 14:56:38 -07:00 committed by Facebook Github Bot
parent ffbd3db61b
commit db225c1e39
1 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
website/src/react-native/css/react-native.css
View File

@ -1013,7 +1013,6 @@ h2 {
text-rendering: optimizelegibility; } text-rendering: optimizelegibility; }
.docs-prevnext { .docs-prevnext {
min-width: 320px;
max-width: 640px; max-width: 640px;
margin: 40px auto; margin: 40px auto;
padding-bottom: 20px; } padding-bottom: 20px; }
@ -2048,6 +2047,15 @@ article li {
.btn:hover { .btn:hover {
text-decoration: none !important; } text-decoration: none !important; }
@media screen and (max-width: 373px) {
.hero .buttons-unit .button {
margin-bottom: 4px; }
.docs-prevnext .btn {
margin-bottom: 4px;
display: block;
float: none; } }
.video-container { .video-container {
border-radius: 4px; border-radius: 4px;
background-clip: padding-box; background-clip: padding-box;