Facebook/react-native
1
0
Fork 0
mirror of https://github.com/facebook/react-native.git synced 2025-11-01 09:14:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updated docs for 0.27

Browse Source
This commit is contained in:
Website Deployment Script
2016-06-07 01:25:27 +00:00
parent 63a3ba82fd
commit b5e6a240fd
8 changed files with 127 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/react-native.css
+50 -22
View File
@@ -481,42 +481,53 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
border-bottom: 0;
}
@media screen and (max-device-width: 960px) {
@media only screen and (max-device-width: 1024px) {
@-webkit-keyframes slide-in {
0% { top: -30px; opacity: 0; }
100% { top: 0; opacity: 1; }
}
@-moz-keyframes slide-in {
0% { top: -30px; opacity: 0; }
100% { top: 0; opacity: 1; }
}
@-o-keyframes slide-in {
0% { top: -30px; opacity: 0; }
100% { top: 0; opacity: 1; }
}
@keyframes slide-in {
0% { top: -30px; opacity: 0; }
100% { top: 0; opacity: 1; }
}
.nav-docs {
position: fixed;
z-index: 90;
top: 0;
top: -100%;
left: 0;
width: 100%;
height: 100%;
margin: 0;
padding: 53px 0 0 0;
background: #3B3738;
/* Transition these properties */
transition: opacity 0.3s, visibility 0.3s;
visibility: hidden;
opacity: 0;
}
.nav-docs-viewport {
border-top: 1px solid rgb(5, 165, 209);
height: 100%;
padding: 25px;
overflow: scroll;
-webkit-overflow-scrolling: touch;
top: -30px;
position: relative;
transition: top 0.3s;
width: 100%;
height: 100%;
}
/* Active state */
.nav-docs.in {
visibility: visible;
opacity: 1;
}
.nav-docs.in .nav-docs-viewport {
top: 0;
-webkit-animation: slide-in 0.3s forwards;
-moz-animation: slide-in 0.3s forwards;
-o-animation: slide-in 0.3s forwards;
animation: slide-in 0.3s forwards;
}
.nav-docs * {
@@ -555,18 +566,38 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
}
}
@media screen and (min-device-width: 641px) and (max-device-width: 1024px) {
/**
* Multicolumn layout for phone (landscape only) & tablet (regardless its screen orientation)/
*/
@media only screen and (min-device-width : 375px) and (max-device-width : 1024px) {
.nav-docs-section ul {
display: flex;
flex-wrap: wrap;
}
/* Display 2 columns on tablet */
.nav-docs-section li {
width: 100%;
}
}
/* 2 columns layout */
@media
/*Phone, landscape screen orientation*/
only screen and (min-device-width : 375px) and (max-device-width : 1024px) and (orientation : landscape),
/*Tablet, portrait screen orientation*/
only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
.nav-docs-section li {
width: 50%;
}
}
/* 3 columns layout on tablet (landscape screen orientation) */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
.nav-docs-section li {
width: 33%;
}
}
.nav-blog li {
margin-bottom: 5px;
}
@@ -1351,13 +1382,10 @@ div[data-twttr-id] iframe {
}
.survey-image {
position: absolute;
top: 10px;
height: 83px;
width: 120px;
float: left;
height: 128px;
width: 128px;
background-image: url('../img/survey.png');
background-size: 272px 198px;
background-position: -8px -8px;
}
.survey p {