Merge with Head

index.html

@@ -10,6 +10,7 @@
       <p>6.002x (Circuits and Electronics) is an experimental on-line adaptation of MIT&rsquo;s first undergraduate analog design course: 6.002. This course will run, free of charge, for students worldwide from March 1, 2012 through June 8, 2012.</p>
     </section>
 </%block>
+
 <%block name="header_class">course</%block>
 
 <section class="index-content">
@@ -101,7 +102,7 @@ $(function() {
                if(json.success) {
                   $('#enroll').html(json.value);
                } else {
-                  $('#enroll_error').html(json.value);
+                  $('#enroll_error').html(json.value).stop().css("background-color", "#933").animate({ backgroundColor: "#333"}, 2000);
                }
              }
         );

login.html

@@ -2,9 +2,12 @@
 ${ error }
 
 <div id="login_div">
-  <h1>Log in to MITx</h1>
+  <header>
+    <h1>Log in to MITx</h1>
+    <p class="no-account">If you don&rsquo;t have an account yet, <a href="#enroll" rel="leanModal">please enroll here</a></p>
+  </header>
+
   <form id="login_form" method="post">
-    <div id="login_error"></div>
     <ol>
       <li>
         <label>E-mail*</label>

main.html

@@ -71,21 +71,24 @@
     <div id="calculator_div" class="leanModal_box">
       <form id="calculator">
         <input type="text" id="calculator_input">
-        <input id="calculator_button" type="submit" value="=&gt;">
+        <input id="calculator_button" type="submit" value="=">
         <input type="text" id="calculator_output" readonly>
       </form>
 
-<table>      <tr><td align="right">Suffixes</td><td>&nbsp;:&nbsp;</td><td align="left"> %kMGTcmunp</td></tr>
-      <tr><td align="right">Operations</td><td>&nbsp;:&nbsp;</td><td align="left"> ^ * / + - ()</td></tr>
-      <tr><td align="right">Functions</td><td>&nbsp;:&nbsp;</td><td align="left"> sin, cos, tan, sqrt, log10, log2, ln, arccos, arcsin, arctan, abs </td></tr>
-      <tr><td align="right">Constants</td><td>&nbsp;:&nbsp;</td><td align="left"> e</td></tr>
-      <!--p> Unsupported: ||, j </p
-Students won't know what parallel means at this time.
-Complex numbers aren't well tested in the courseware, so we would prefer to not expose them.
-If you read the comments in the source, feel free to use them. If you run into a bug, please
-let us know. But we can't officially support them right now.
--->
-</table>
+      <dl>
+        <dt>Suffixes:</dt>
+        <dd> %kMGTcmunp</dd>
+        <dt>Operations:</dt>
+        <dd>^ * / + - ()</dd>
+        <dt>Functions:</dt>
+        <dd>sin, cos, tan, sqrt, log10, log2, ln, arccos, arcsin, arctan, abs </dd>
+        <dt>Constants</dt>
+        <dd>e</dd>
+
+       <!-- Students won't know what parallel means at this time.  Complex numbers aren't well tested in the courseware, so we would prefer to not expose them.  If you read the comments in the source, feel free to use them. If you run into a bug, please let us know. But we can't officially support them right now.
+
+       <dt>Unsupported:</dt> <dd>||, j </dd>  -->
+      </dl>
     </div>
 
 <script>

marketing.html

@@ -87,7 +87,6 @@ function postJSON(url, data, callback) {
   <%block name="bodyextra"/>
 
   <footer>
-    <!-- Template based on a design from http://www.dotemplate.com/ - Donated $10 (pmitros) so we don't need to include credit. -->
     <div class="footer-wrapper">
       <p> Copyright &copy; 2012. MIT. <a href="/t/copyright.html">Some rights reserved.</a></p>
 
@@ -122,8 +121,10 @@ $(document).ready(function(){
       function(json) {
         if(json.success) {
           location.href="/courseware";
+        } else if($('#login_error').length == 0) {
+        $('#login_form').prepend('<div id="login_error">Email or password is incorrect.</div>');
         } else {
-          $('#login_error').html("Invalid Login");
+          $('#login_error').stop().css("background-color", "#933").animate({ backgroundColor: "#333"}, 2000);
         }
       }
     );
@@ -140,7 +141,7 @@ $(document).ready(function(){
         if (json.success) {
           $('#pwd_reset').html(json.value);
         } else {
-          $('#pwd_error').html(json.error);
+          $('#pwd_error').html(json.error).stop().css("background-color", "#933").animate({ backgroundColor: "#333"}, 2000);
         }
       }
     );

sass/_base-extends.scss

@@ -19,6 +19,13 @@
   }
 }
 
+h1.top-header {
+  margin: (-(lh())) (-(lh())) lh();
+  padding: lh();
+  background: #f3f3f3;
+  border-bottom: 1px solid #e3e3e3;
+}
+
 .button {
   @include box-shadow(inset 0 1px 0 lighten(#888, 10%), 0 0 3px #ccc);
   @include linear-gradient(lighten(#888, 5%), darken(#888, 5%));

sass/_index-extends.scss

@@ -48,19 +48,21 @@
 
 .button {
   @include border-radius(3px);
-  @include border-radius(3px);
   @include inline-block();
   @include transition();
   background-color: $mit-red;
+  border: 1px solid darken($mit-red, 10%);
   color: #fff;
   margin: lh() 0 lh(.5);
   padding: lh(.25) lh(.5);
   text-decoration: none;
   font-style: normal;
+  @include box-shadow(inset 0 1px 0 lighten($mit-red, 8%));
   -webkit-font-smoothing: antialiased;
 
   &:hover {
     background-color: darken($mit-red, 10%);
+    border-color: darken($mit-red, 20%);
   }
 
   span {

sass/_index.scss

@@ -167,13 +167,16 @@ header.announcement {
 
           a {
             @extend .button;
+            @include box-shadow(inset 0 1px 0 darken($mit-red, 10%), 0 1px 0 lighten($mit-red, 5%));
             background-color: darken($mit-red, 20%);
             display: block;
             padding: lh(.5) lh();
+            border-color: darken($mit-red, 30%);
             text-align: center;
 
             &:hover {
               background-color: darken($mit-red, 10%);
+              border-color: darken($mit-red, 20%);
             }
           }
         }
@@ -410,11 +413,12 @@ section.index-content {
 
         &.cta {
           width: 100%;
+          text-align: center;
 
           a.enroll {
             @extend .button;
-            padding: lh(.5) lh();
-            display: block;
+            padding: lh(.5) lh(2);
+            @include inline-block();
             text-align: center;
             font: 800 18px $header-font-family;
           }

sass/_info.scss

@@ -3,37 +3,88 @@ div.info-wrapper {
 
   section.updates {
     @extend .content;
+
+    > h1 {
+      @extend .top-header;
+    }
+
+    > p {
+      margin-bottom: lh();
+    }
+
+    ol {
+      list-style: none;
+
+      li {
+        padding-bottom: lh(.5);
+        margin-bottom: lh(.5);
+        @extend .clearfix;
+        border-bottom: 1px solid #e3e3e3;
+
+        h2 {
+          float: left;
+          width: flex-grid(2, 9);
+          margin: 0 flex-gutter() 0 0;
+        }
+
+        p {
+          float: left;
+          width: flex-grid(7, 9);
+          margin-bottom: 0;
+        }
+      }
+    }
   }
 
   section.handouts {
     @extend .sidebar;
-    @include border-radius(0px 4px 0px 4px);
+    @include border-radius(0 4px 4px 0);
     border-right: 0;
     border-left: 1px solid #d3d3d3;
 
     h1 {
       padding: 0 lh();
+      font-size: 18px;
     }
 
     ol {
       list-style: none;
 
       li {
-        h2 {
-          padding: 0 lh();
+        @include box-shadow(0 1px 0 #eee);
+        border-bottom: 1px solid #d3d3d3;
+        @extend .clearfix;
+
+        p {
+          padding: 7px lh();
+          margin: 0;
+          text-transform: none;
+          letter-spacing: 0;
+          font-size: $body-font-size;
+
+          &:hover {
+            background: #efefef;
+          }
+
+          a {
+            display: inline;
+            padding: 0;
+
+            &:hover {
+              text-decoration: underline;
+              background: none;
+            }
+          }
         }
 
         a {
-          @include box-shadow(0 1px 0 #eee);
           @include transition();
-          border-bottom: 1px solid #d3d3d3;
           color: lighten($text-color, 10%);
           display: block;
           padding: 7px lh();
           text-decoration: none;
 
           &:hover {
-            @include box-shadow(0 1px 0 #fff);
             background: #efefef;
           }
         }

sass/_leanmodal.scss

@@ -83,14 +83,17 @@ div.leanModal_box {
     text-align: left;
 
     div#enroll_error, div#login_error, div#pwd_error {
+      $error-color: #333;
       -webkit-font-smoothing: antialiased;
-      background-color: #F50200;
+      background-color: $error-color;
+      border: darken($error-color, 20%);
       color: #fff;
+      text-shadow: 0 1px 0 darken($error-color, 10%);
+      font-family: "Open sans";
       font-weight: bold;
       letter-spacing: 1px;
-      margin-bottom: lh();
-      padding: lh(.2);
-      text-transform: uppercase;
+      margin: (-(lh())) (-(lh())) lh();
+      padding: lh(.5);
 
       &:empty {
         padding: 0;
@@ -157,6 +160,18 @@ div.leanModal_box {
 div#login {
   min-width: 400px;
 
+  header {
+    border-bottom: 1px solid #ddd;
+    margin-bottom: lh();
+    padding-bottom: lh();
+
+    h1 {
+      border-bottom: 0;
+      padding-bottom: 0;
+      margin-bottom: lh(.25);
+    }
+  }
+
   ol {
     li {
       width: auto;
@@ -202,3 +217,53 @@ div#feedback_div{
     }
   }
 }
+
+div#calculator_div {
+  max-width: 500px;
+
+
+  form {
+    padding-bottom: lh();
+    margin-bottom: lh();
+    border-bottom: 1px solid #ddd;
+
+    input#calculator_input {
+      width: 400px;
+    }
+
+    input#calculator_button {
+      background: 0;
+      color: $mit-red;
+      border: 0;
+      @include box-shadow(none);
+      padding: 0;
+      text-shadow: none;
+
+      &:hover {
+        color: #333;
+      }
+    }
+
+    input#calculator_output {
+      border: 0;
+      background: 0;
+      padding: lh(.35);
+      width: 60px;
+      font-size: 24px;
+      font-weight: bold;
+    }
+  }
+
+  dl {
+    dt {
+      float: left;
+      clear: both;
+      padding-right: lh(.5);
+      font-weight: bold;
+    }
+
+    dd {
+      float: left;
+    }
+  }
+}

sass/_profile.scss

@@ -9,7 +9,8 @@ div.profile-wrapper {
     border-right: 0;
 
     h1 {
-      padding: lh();
+      padding:0 lh();
+      font-size: 18px;
     }
 
     ul {
@@ -52,6 +53,10 @@ div.profile-wrapper {
   section.course-info {
     @extend .content;
 
+    > h1 {
+      @extend .top-header;
+    }
+
     ol {
       list-style: none;
 

simplewiki_instructions.html

@@ -5,7 +5,7 @@
   <p class="markdown-example">circuit:basic</p>
   <p class="markdown-example"><span>$</span>LaTeX Math Expression<span>$</span></p>
   To create a new wiki article, create a link to it. Clicking the link gives you the creation page.  
-  <p class="markdown-example">[Article Name](/wiki/view/ArticleName)</p>
+  <p class="markdown-example">[Article Name](wiki:ArticleName)</p>
   Other useful examples:<br>
   <p class="markdown-example">[Link](http://google.com)</p>
   <p class="markdown-example">Huge Header