From 7e40a9889e6891eca0e91e8fe3aa94fbfa8874e4 Mon Sep 17 00:00:00 2001
From: Travis CI <travis@Traviss-Mac-163.local>
Date: Thu, 15 Oct 2015 16:24:43 +0000
Subject: [PATCH] update website

---
 css/react-native.css | 33 +++++++++++++++++++--------------
 docs/alertios.html   |  2 +-
 js/scripts.js        |  8 ++++++--
 3 files changed, 26 insertions(+), 17 deletions(-)

diff --git a/css/react-native.css b/css/react-native.css
index af9dc958bbc..9ac2edf04a5 100644
--- a/css/react-native.css
+++ b/css/react-native.css
@@ -880,7 +880,7 @@ small code, li code, p code {
   height: 95%;
   left: 0;
   margin: auto;
-  max-height: 620px;
+  max-height: 648px;
   max-width: 460px;
   overflow: auto;
   position: fixed;
@@ -890,23 +890,27 @@ small code, li code, p code {
   z-index: 9999;
 }
 
-.modal-open {
-  display: block;
-}
+.modal-open { display: block; }
 
 .modal-content {
-  padding: 40px 24px 24px 24px;
+  padding: 40px 24px 8px 24px;
   position: relative;
 }
 
-.modal-content iframe {
-  margin: 0 auto;
-}
+.modal-content iframe { margin: 0 auto; }
 
 .modal-button-open {
+  cursor: pointer;
   text-align: center;
 }
 
+.modal-button-open-img {
+  background: #05A5D1;
+  height: 358px;
+}
+
+.modal-button-open-img:hover img { opacity: 0.9; }
+
 .modal-button-close {
   background: transparent;
   border-radius: 0 0 0 4px;
@@ -921,12 +925,13 @@ small code, li code, p code {
   right: 0;
   top: 0;
 }
-  .modal-button-close:active,
-  .modal-button-close:focus,
-  .modal-button-close:hover {
-    background: #EAF8FD;
-    outline: none;
-  }
+
+.modal-button-close:active,
+.modal-button-close:focus,
+.modal-button-close:hover {
+  background: #EAF8FD;
+  outline: none;
+}
 
 @media screen and (max-width: 960px) {
   .nav-main {
diff --git a/docs/alertios.html b/docs/alertios.html
index b09320298aa..099d87ba092 100644
--- a/docs/alertios.html
+++ b/docs/alertios.html
@@ -197,7 +197,7 @@ class <span class="token class-name">PromptExample</span> extends <span class="t
     backgroundColor<span class="token punctuation">:</span> <span class="token string">&#x27;#eeeeee&#x27;</span><span class="token punctuation">,</span>
     padding<span class="token punctuation">:</span> <span class="token number">10</span><span class="token punctuation">,</span>
   <span class="token punctuation">}</span><span class="token punctuation">,</span>
-<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div></div><div class="docs-prevnext"><a class="docs-next" href="animated.html#content">Next →</a></div></div><div class="column-left"><p><strong>Run this example</strong></p><div class="modal-button-open"><img src="/react-native/img/alertIOS.png"></div><div><div class="modal"><div class="modal-content"><button class="modal-button-close">×</button><div class="center"><iframe class="simulator" src="https://appetize.io/embed/bypdk4jnjra5uwyj2kzd2aenv4?device=iphone5s&amp;scale=70&amp;autoplay=false&amp;orientation=portrait&amp;deviceColor=white&amp;params=%7B%22route%22%3A%22AlertIOS%22%7D" width="274" height="550" scrolling="no"></iframe></div></div></div><div class="modal-backdrop"></div></div></div></section><footer class="wrap"><div class="center">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
+<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div></div><div class="docs-prevnext"><a class="docs-next" href="animated.html#content">Next →</a></div></div><div class="column-left"><p><a class="modal-button-open"><strong>Run this example</strong></a></p><div class="modal-button-open modal-button-open-img"><img alt="Run example in simulator" width="170" height="358" src="/react-native/img/alertIOS.png"></div><div><div class="modal"><div class="modal-content"><button class="modal-button-close">×</button><div class="center"><iframe class="simulator" src="https://appetize.io/embed/bypdk4jnjra5uwyj2kzd2aenv4?device=iphone5s&amp;scale=70&amp;autoplay=false&amp;orientation=portrait&amp;deviceColor=white&amp;params=%7B%22route%22%3A%22AlertIOS%22%7D" width="256" height="550" scrolling="no"></iframe><p>Powered by <a target="_blank" href="https://appetize.io">appetize.io</a></p></div></div></div><div class="modal-backdrop"></div></div></div></section><footer class="wrap"><div class="center">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
             (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
             (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
             m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
diff --git a/js/scripts.js b/js/scripts.js
index d0cd7b766e6..85e92a78c3b 100644
--- a/js/scripts.js
+++ b/js/scripts.js
@@ -8,12 +8,16 @@
 
   function init() {
     var backdrop = document.querySelector('.modal-backdrop');
-    var modalButtonOpen = document.querySelector('.modal-button-open');
+    var modalButtonOpenList = document.querySelectorAll('.modal-button-open');
     var modalButtonClose = document.querySelector('.modal-button-close');
 
     backdrop.addEventListener('click', hideModal);
-    modalButtonOpen.addEventListener('click', showModal);
     modalButtonClose.addEventListener('click', hideModal);
+
+    // Bind event to NodeList items
+    for (var i = 0; i < modalButtonOpenList.length; ++i) {
+      modalButtonOpenList[i].addEventListener('click', showModal);
+    }
   }
 
   function showModal(e) {