From 6da378e735b7b4a4e98f5405a3459ce5ef953339 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Tue, 9 Oct 2012 10:46:46 -0400
Subject: [PATCH] tweaked edge template to target students only

---
 cms/static/sass/_edge.scss   | 121 +++++++++++++++--------------------
 cms/templates/temp-edge.html |  49 +++++++-------
 2 files changed, 75 insertions(+), 95 deletions(-)

diff --git a/cms/static/sass/_edge.scss b/cms/static/sass/_edge.scss
index e057228f52..a0eddd4a68 100644
--- a/cms/static/sass/_edge.scss
+++ b/cms/static/sass/_edge.scss
@@ -1,97 +1,78 @@
 .edge-landing {
+  border-top: 5px solid $blue;
+
   header {
     @include clearfix;
     background: $extraDarkGrey;
     border-bottom: 3px solid $blue;
   }
 
-  .log-in-form {
-    @include clearfix;
-    float: right;
-    padding: 10px;
+  .main-wrapper {
+    width: 940px;
+    margin: auto;
 
-    .column {
+    .content {
+      padding: 24px 60px 36px;
+      border-radius: 3px;
+      background: #fff;
+      box-shadow: 0 0 50px rgba(0, 0, 0, .1);
+      @include clearfix;
+    }
+
+    .log-in-form {
       float: left;
-      width: 200px;
-      margin-right: 10px;
+      width: 470px;
+      margin-right: 50px;
+      padding-right: 49px;
+      border-right: 1px solid $lightGrey;
 
-      &.submit {
-        width: auto;
+      .row {
+        margin-bottom: 20px;
+      }
+
+      label {
+        font-weight: 700;
       }
 
       input {
         width: 100%;
-        padding: 5px 8px 7px;
-        @include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1));
-        background-color: #4e5153;
-        border-color: #1c1e20;
-        color: #fff;
+        font-size: 21px;
+        font-weight: 300;
       }
 
-      input[type="submit"] {
-        @include dark-grey-button;
-        position: relative;
-        top: -1px;
-        width: 100px;
-        padding: 6px 20px 8px;
-        font-size: 11px;
-        font-weight: 400;
-      }
-    }
-
-    .forgot-button {
-      font-size: 11px;
-      margin-left: 5px;
-    }
-  }
-
-  .main-wrapper {
-    width: 980px;
-    margin: auto;
-
-    .column {
-      float: left;
-      width: 400px;
-      padding: 26px 40px 40px;
-      border-radius: 3px;
-      background: #fff;
-      -webkit-transition: all .15s;
-      @include box-shadow(0 0 50px rgba(0, 0, 0, .1));
-
-      &:hover {
-        background: $blue;
-
-        h2 {
-          color: #fff;
-        }
-
-        p {
-          color: #bee1f0;
-        }
+      .log-in-submit-button {
+        @include blue-button;
+        width: 130px;
+        padding: 8px 20px 10px;
+        font-size: 16px;
       }
 
-      &.left {
-        margin-right: 10px;
-      }
-
-      &.right {
+      .forgot-button {
+        font-size: 12px;
         margin-left: 10px;
       }
     }
 
-    h2 {
-      margin-bottom: 12px;
-      font-size: 30px;
-      font-weight: 300;
-      color: $blue;
-      @include transition(all .15s);
+    .sign-up {
+      float: left;
+      width: 250px;
+
+      .register-button {
+        @include grey-button;
+        margin-top: 20px;
+      }
     }
 
-    p {
-      font-size: 14px;
-      line-height: 1.4;
-      color: #7d7d7d;
-      @include transition(all .15s);
+    h2 {
+      margin-bottom: 30px;
+      font-size: 24px;
+      font-weight: 300;
+    }
+
+    h3 {
+      margin-bottom: 30px;
+      font-size: 24px;
+      font-weight: 300;      
     }
   }
 
diff --git a/cms/templates/temp-edge.html b/cms/templates/temp-edge.html
index 951f6d01d1..c8f0b69242 100644
--- a/cms/templates/temp-edge.html
+++ b/cms/templates/temp-edge.html
@@ -5,33 +5,32 @@
 
 <%block name="content">
 
-<header>
-  <div class="log-in-form">
-    <form>
-      <div class="column">
-        <input name="email" type="email" class="email-field" tabindex="1" placeholder="email">
-      </div>
-      <div class="column">
-        <input name="password" type="password" class="password-field" tabindex="2" placeholder="password">
-      </div>
-      <div class="column submit">
-        <input name="submit" type="submit" value="Log In" class="log-in-submit-button" tabindex="3">
-        <a href="#" class="forgot-button">Forgot password?</a>
-      </div>
-    </form>
-  </div>
-</header>
-
 <div class="main-wrapper">
   <div class="edx-edge-logo-large"></div>
-  <a href="#" class="column left">
-    <h2>Create a course</h2>
-    <p>Hendrerit in vulputate velit, esse molestie consequat vel illum dolore eu feugiat. Exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Modo typi qui nunc nobis, videntur parum clari.</p>
-  </a>
-  <a href="#" class="column right">
-    <h2>Register for courses</h2>
-    <p>Hendrerit in vulputate velit, esse molestie consequat vel illum dolore eu feugiat. Exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Modo typi qui nunc nobis, videntur parum clari.</p>
-  </a>
+  <div class="content">
+    <div class="log-in-form">
+      <h2>Log in to your courses</h2>
+      <form>
+        <div class="row">
+          <label>Email</label>
+          <input name="email" type="email" class="email-field" tabindex="1">
+        </div>
+        <div class="row">
+          <label>Password</label>
+          <input name="password" type="password" class="password-field" tabindex="2">
+        </div>
+        <div class="row submit">
+          <input name="submit" type="submit" value="Log In" class="log-in-submit-button" tabindex="3">
+          <a href="#" class="forgot-button">Forgot password?</a>
+        </div>
+      </form>
+    </div>
+    <div class="sign-up">
+      <h3>Register for classes</h3>
+      <p>Take free online courses from today's leading universities.</p>
+      <p><a href="#" class="register-button">Register</a></p>
+    </div>
+  </div>
 </div>
 
 </%block>
\ No newline at end of file