Make the modal window work in the courseware

lms/static/sass/course/base/_base.scss

@@ -15,3 +15,9 @@ table {
     table-layout: fixed;
   }
 }
+
+form {
+  label {
+    display: block;
+  }
+}

lms/static/sass/marketing-ie.css

-body {
-  margin: 0;
-  padding: 0; }
-
-.wrapper, .subpage, section.copyright, section.tos, section.privacy-policy, section.honor-code, header.announcement div, section.index-content, footer {
-  margin: 0;
-  overflow: hidden; }
-
-div#enroll form {
-  display: none; }

lms/static/sass/shared/_modal.scss

@@ -299,3 +299,7 @@
     }
   }
 }
+
+.leanModal_box {
+  @extend .modal;
+}

lms/templates/profile.html

@@ -110,7 +110,6 @@ $(function() {
 </script>
 </%block>
 
-
 <%include file="course_navigation.html" args="active_page='profile'" />
 
 <section class="container">
@@ -150,7 +149,6 @@ $(function() {
                 %endif
               </p>
 
-
               %if len(section['scores']) > 0:
                 <section class="scores">
                   <h3> ${ "Problem Scores: " if section['graded'] else "Practice Scores: "} </h3>
@@ -210,7 +208,7 @@ $(function() {
   </div>
 </section>
 
-<div id="password_reset_complete" class="leanModal_box">
+<div id="password_reset_complete" class="modal">
   <a href="#password_reset_complete" rel="leanModal" id="password_reset_complete_link"></a>
   <h1>Password Reset Email Sent</h1>
   <p>
@@ -218,83 +216,78 @@ $(function() {
   </p>
 </div>
 
-<div id="apply_name_change" class="leanModal_box">
-  <h1>Apply to change your name</h1>
+<div id="apply_name_change" class="modal">
+  <div class="inner-wrapper">
+    <header>
+      <h2>Apply to change your name</h2>
+      <hr />
+    </header>
     <form id="change_name_form">
       <div id="change_name_error"> </div>
       <fieldset>
         <p>To uphold the credibility of <span class="edx">edX</span> certificates, name changes must go through an approval process. A member of the course staff will review your request, and if approved, update your information. Please allow up to a week for your request to be processed. Thank you.</p>
-      <ul>
-        <li>
         <label>Enter your desired full name, as it will appear on the <span class="edx">edX</span> Certificate: </label>
         <input id="new_name_field" value="" type="text" />
-        </li>
-        <li>
         <label>Reason for name change:</label>
         <textarea id="name_rationale_field" value=""></textarea>
-        </li>
-        <li>
         <input type="submit" id="submit">
-        </li>
-      </ul>
       </fieldset>
     </form>
+  </div>
 </div>
 
-<div id="change_email" class="leanModal_box">
-  <h1>Change e-mail</h1>
+<div id="change_email" class="modal">
+  <div class="inner-wrapper">
+  <header>
+    <h2>Change e-mail</h2>
+    <hr />
+  </header>
   <div id="apply_name_change_error"></div>
   <form id="change_email_form">
     <div id="change_email_error"> </div>
     <fieldset>
-      <ul>
-        <li>
       <label> Please enter your new email address: </label>
       <input id="new_email_field" type="email" value="" />
-        </li>
-
-        <li>
       <label> Please confirm your password: </label>
       <input id="new_email_password" value="" type="password" />
-        </li>
-        <li>
       <p>We will send a confirmation to both ${email} and your new e-mail as part of the process.</p>
       <input type="submit" id="submit_email_change" />
-        </li>
-      </ul>
     </fieldset>
   </form>
+  </div>
 </div>
 
-<div id="deactivate-account" class="leanModal_box">
-  <h1>Deactivate <span class="edx">edX</span> Account</h1>
+<div id="deactivate-account" class="modal">
+  <div class="inner-wrapper">
+    <header>
+      <h2>Deactivate <span class="edx">edX</span> Account</h2>
+      <hr />
+    </header>
     <p>Once you deactivate you&rsquo;re MIT<em>x</em> account you will no longer recieve updates and new class announcements from MIT<em>x</em>.</p>
     <p>If you&rsquo;d like to still get updates and new class announcements you can just <a href="#unenroll" rel="leanModal">unenroll</a> and keep your account active.</p>
 
     <form id="unenroll_form">
       <div id="unenroll_error"> </div>
       <fieldset>
-      <ul>
-        <li>
         <input type="submit" id="" value="Yes, I don't want an edX account or hear about any new classes or updates to edX" />
-        </li>
-      </ul>
       </fieldset>
     </form>
+  </div>
 </div>
 
-<div id="unenroll" class="leanModal_box">
-  <h1>Unenroll from 6.002x</h1>
+<div id="unenroll" class="modal">
+  <div class="inner-wrapper">
+    <header>
+      <h2>Unenroll from 6.002x</h2>
+      <hr />
+    </header>
     <p>Please note: you will still receive updates and new class announcements from ed<em>X</em>. If you don&rsquo;t wish to receive any more updates or announcements <a href="#deactivate-account" rel="leanModal">deactivate your account</a>.</p>
 
     <form id="unenroll_form">
       <div id="unenroll_error"> </div>
       <fieldset>
-      <ul>
-        <li>
         <input type="submit" id="" value="Yes, I want to unenroll from 6.002x but still hear about any new classes or updates to edX" />
-        </li>
-      </ul>
       </fieldset>
     </form>
+  </div>
 </div>

lms/templates/simplewiki/simplewiki_edit.html

@@ -65,12 +65,10 @@ ${"Edit " + wiki_title + " - " if wiki_title is not UNDEFINED else ""}MITx 6.002
   </div>
   ${wiki_form}
   %if create_article:
-  <input type="submit" id="submit_edit" value="Create article" /></td>
+  <input type="submit" id="submit_edit" value="Create article" />
   %else:
   <input type="submit" id="submit_edit" name="edit" value="Save Changes" />
   <input type="submit" id="submit_delete" name="delete" value="Delete article" />
-  %endif
-</form>
 
 <%include file="simplewiki_instructions.html"/>