From 0c4ffa993d528cacd27e5aff1b79ccb5c262c676 Mon Sep 17 00:00:00 2001
From: connors <connor.sears@github.com>
Date: Sun, 13 Oct 2013 18:12:05 -0700
Subject: [PATCH] Starting to rework the homepage

---
 _layouts/default.html    |   4 +-
 docs-assets/css/docs.css | 149 ++-------------------------------------
 index.html               |  43 ++---------
 3 files changed, 13 insertions(+), 183 deletions(-)

diff --git a/_layouts/default.html b/_layouts/default.html
index 4d1e769..cdd2fe4 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -10,7 +10,7 @@
     <!-- Page content -->
     {{ content }}
 
-    <!-- Footer
-    {% include footer.html %} -->
+    <!-- Footer -->
+    {% include footer.html %}
   </body>
  </html>
\ No newline at end of file
diff --git a/docs-assets/css/docs.css b/docs-assets/css/docs.css
index 0c1436c..ce0d4b4 100644
--- a/docs-assets/css/docs.css
+++ b/docs-assets/css/docs.css
@@ -40,165 +40,23 @@ h6 {
 }
 
 .docs-inner-wrapper {
-  width: 1000px;
+  width: 1170px;
   margin: 0 auto;
 }
 
-/* Masthead (navigation)
--------------------------------------------------- */
-
-.docs-masthead {
-  position: fixed;
-  top: 0;
-  right: 0;
-  left: 0;
-  z-index: 100;
-  padding: 10px 0;
-  background-color: #fff;
-  border-bottom: 1px solid #ddd;
-}
-
-.docs-masthead .docs-inner-wrapper {
-  line-height: 40px;
-}
-
-.docs-masthead-title {
-  padding: 0;
-  margin: 0;
-  font-weight: 700;
-  font-size: 21px;
-  text-transform: uppercase;
-  letter-spacing: 5px;
-}
-
-.docs-navigation {
-  float: right;
-  padding: 0;
-  margin: 0;
-  font-size: 15px;
-}
-
-.nav-item {
-  position: relative;
-  float: left;
-  margin-right: 30px;
-  list-style: none;
-}
-
-.nav-item:last-child {
-  margin-right: 0;
-}
-
-.nav-item a {
-  position: relative;
-  color: #777;
-  text-decoration: none;
-}
-
-.nav-item a:hover {
-  color: #555;
-}
-
-/* Give the components link a bit more room to fit the caret */
-.nav-item.nav-components {
-  margin-right: 45px;
-}
-
-/* Give the  components link a down caret */
-.nav-components-link:after {
-  content: '';
-  position: absolute;
-  right: 0;
-  width: 0;
-  height: 0;
-  top: 8px;
-  right: -15px;
-  margin-left: -4px;
-  border-right: 4px solid transparent;
-  border-top: 4px solid #777;
-  border-left: 4px solid transparent;
-}
-
-/* The components list dropdown */
-.components-list {
-  position: absolute;
-  display: none;
-  top: 45px;
-  left: -20px;
-  z-index: -1;
-  padding: 10px 0;
-  line-height: 1.1;
-  background-color: #fff;
-  background-clip: padding-box;
-  border: 1px solid rgba(0,0,0,.2);
-  border-radius: 3px;
-  box-shadow: 0 0 8px rgba(0,0,0,.05);
-}
-
-.components-list.active {
-  z-index: 100;
-  display: block;
-}
-
-.components-list:before,
-.components-list:after {
-  content: '';
-  position: absolute;
-  left: 30px;
-  width: 0;
-  height: 0;
-}
-
-.components-list:before {
-  top: -11px;
-  margin-left: -11px;
-  border-right: 11px solid transparent;
-  border-bottom: 11px solid rgba(0,0,0,.3);
-  border-left: 11px solid transparent;
-}
-
-.components-list:after {
-  top: -10px;
-  margin-left: -10px;
-  border-right: 10px solid transparent;
-  border-bottom: 10px solid #fff;
-  border-left: 10px solid transparent;
-}
-
-.components-list li {
-  list-style: none;
-}
-
-.components-list li:last-child {
-  padding-bottom: 0;
-}
-
-.components-list li a {
-  display: block;
-  width: 150px;
-  padding: 10px 20px;
-}
-
-.components-list li a:hover {
-  color: #fff;
-  background-color: #1eb0e9;
-}
-
 /* Jumbo header
 -------------------------------------------------- */
 
 .docs-header {
-  height: 530px;
-  margin-top: 60px;
   background-color: #fafafa;
 }
 
 .docs-header-text {
-  position: relative;
   z-index: 3;
-  top: 140px;
   width: 800px;
   margin: 0 auto;
+  padding-top: 140px;
+  padding-bottom: 150px;
   color: #333;
   text-align: center;
   -webkit-animation: fadeintext 2s;
@@ -206,6 +64,7 @@ h6 {
 }
 
 .docs-header-subtitle {
+  margin-top: 0;
   margin-bottom: 35px;
   font-size: 45px;
   font-weight: 300;
diff --git a/index.html b/index.html
index 299773e..4af4ffd 100644
--- a/index.html
+++ b/index.html
@@ -1,5 +1,5 @@
 ---
-layout: default
+layout: home
 title: Ratchet
 base_url: "./"
 ---
@@ -8,10 +8,13 @@ base_url: "./"
   <div class="docs-inner-wrapper">
     <hgroup class="docs-header-text">
       <h2 class="docs-header-subtitle">Prototype iPhone apps with simple HTML, CSS, and JS components.</h2>
-      <a data-ignore="push" href="http://maker.github.com/ratchet/ratchet.zip" class="docs-btn" onClick="_gaq.push(['_trackEvent', 'Downloads', 'V1.0']);">Download Ratchet</a>
+      <a data-ignore="push" href="http://maker.github.com/ratchet/ratchet.zip" class="docs-btn" onClick="_gaq.push(['_trackEvent', 'Downloads', 'V2.0']);">Download Ratchet</a>
     </hgroup>
   </div>
-  <section class="social">
+</header>
+</div>
+
+<!--<section class="social">
     <ul>
       <li>
         <iframe src="http://ghbtns.com/github-btn.html?user=maker&repo=ratchet&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe>
@@ -25,36 +28,4 @@ base_url: "./"
         <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
       </li>
     </ul>
-  </section>
-</header>
-
-<!-- Getting started -->
-<div class="docs-outer-wrapper docs-content">
-  <section class="content-section section-informational" id="gettingStarted">
-    <div class="docs-inner-wrapper">
-      <ol class="steps">
-        <li class="step">
-          <div class="step-icon">
-            <span class="icon icon-pages"></span>
-          </div>
-          <h3 class="step-title">Create your pages</h3>
-          <p class="step-description">Use these docs as a reference for all the available components and piece together the pages of your app. Customize the style too - make the prototype all your own.</p>
-        </li>
-        <li class="step">
-          <div class="step-icon">
-            <span class="icon icon-refresh"></span>
-          </div>
-          <h3 class="step-title">Connect pages with push.js</h3>
-          <p class="step-description">Read about <a href="#push">push.js</a> then start connecting your pages. Push.js allows you to create a prototype that feels like a real app when you save it to your phone. (Need to have a server running).</p>
-        </li>
-        <li class="step">
-          <div class="step-icon">
-            <span class="icon icon-share"></span>
-          </div>
-          <h3 class="step-title">Save the prototype to your phone</h3>
-          <p class="step-description">There are <a href="https://groups.google.com/forum/#!topic/goratchet/IboE6SCMAyw">a few ways to do this</a>, but the simplest is to run a local server on your computer, point Safari on your iPhone to your computer, then click the <span class="icon icon-share"></span> button and "Add to Home Screen".</p>
-        </li>
-      </ol>
-    </div>
-  </section>
-</div>
\ No newline at end of file
+  </section>-->
\ No newline at end of file