Fix navigation menu regression on mobile

Summary:
Regression introduced in 75eb55096e and identified by Conor O'Donnell (https://twitter.com/ronocod/status/892400271980146689).

Verify mobile layout on iPhone 6, iPhone 7 Plus, Galaxy S5, Nexus 5.
<img width="269" alt="screen shot 2017-08-01 at 9 13 42 am" src="https://user-images.githubusercontent.com/165856/28835318-cdd20cc8-7699-11e7-9232-a657a93cfb1c.png">

Verify desktop layout at widths ranging from 400px to 1400px.

<img width="1303" alt="screen shot 2017-08-01 at 9 14 44 am" src="https://user-images.githubusercontent.com/165856/28835352-e33a97e2-7699-11e7-969e-db607e9a0162.png">
Closes https://github.com/facebook/react-native/pull/15314

Differential Revision: D5537209

Pulled By: hramos

fbshipit-source-id: 3ccf71a90dda4b9b1a059178a400bea9f253bf14
This commit is contained in:
Hector Ramos
2017-08-02 14:20:23 +02:00
committed by Mike Grabowski
parent 8c3fbfa3b2
commit 4223f116fa
@@ -609,7 +609,6 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
.nav-main .nav-site-wrapper {
display: inline;
float: right;
}
.nav-main .nav-site-internal {
@@ -749,6 +748,13 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
padding-bottom: 0;
border-bottom: 0; }
@media only screen and (min-width: 680px) {
.nav-main .nav-site-wrapper {
display: inline;
float: right;
}
}
@media only screen and (max-device-width: 1024px) {
@-webkit-keyframes slide-in {
0% {
@@ -824,7 +830,8 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
.nav-docs-section a.active {
border-bottom-style: solid;
border-bottom-width: 1px;
color: #05A5D1; } }
color: #05A5D1; }
}
/**
* Multicolumn layout for phone (landscape only) & tablet (regardless its screen orientation)/