status-im/react-native
2
0
Fork 0
mirror of https://github.com/status-im/react-native.git synced 2025-02-26 08:05:34 +00:00
Code Issues Projects Releases Wiki Activity

Fix navigation menu regression on mobile

Browse Source 
Summary:
Regression introduced in 75eb55096eff4e29321a8914980b81b97a459b70 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-01 09:47:56 -07:00 committed by Facebook Github Bot
parent 24df099835
commit 471c9da4d6
1 changed files with 9 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -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)/