Permalink
Browse files

Fix navigation menu regression on mobile

Summary:
Regression introduced in 75eb550 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 #15314

Differential Revision: D5537209

Pulled By: hramos

fbshipit-source-id: 3ccf71a90dda4b9b1a059178a400bea9f253bf14
  • Loading branch information...
hramos authored and facebook-github-bot committed Aug 1, 2017
1 parent 24df099 commit 471c9da4d6c404459973d22c27b847f33e699c8c
Showing with 9 additions and 2 deletions.
  1. +9 −2 website/src/react-native/css/react-native.css
@@ -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)/

0 comments on commit 471c9da

Please sign in to comment.