port the course_detail page and the add_note form to foundation 4

diff --git a/karmaworld/templates/courses/course_detail.html b/karmaworld/templates/courses/course_detail.html
index cc922366eddc2b71581d0890ff79be4a98b494b3..fa572ffeb46731df3f7854bf11688085ed40c9a1 100644 (file)
--- a/karmaworld/templates/courses/course_detail.html
+++ b/karmaworld/templates/courses/course_detail.html
@@ -33,14 +33,15 @@
   <section id="course_content">
 
     <div id="course_header">
+
       <div class="row">
-        <div id="breadcrumbs" class="ten columns offset-by-one">
+        <div id="breadcrumbs" class="small-12 columns">
           <a href="/">Home</a> &gt; <a href="{{ course.get_absolute_url }}">{{ course.name }}</a>
         </div><!-- /course_subhead -->
       </div>
 
       <div class="row">
-        <div id="course_name" class="twelve columns">
+        <div id="course_name" class="small-12 columns">
           {% if course.url %}
           <a rel="nofollow" href="{{ course.url }}">
             {{ course.name }}
@@ -52,7 +53,7 @@
       </div>
 
       <div class="row">
-        <div id="course_meta" class="twelve columns">
+        <div id="course_meta" class="small-12 columns">
           <div class="course_details">
             {{ course.instructor_name }} | {{ course.school.name }}
           </div><!-- /activity_details_context -->
@@ -60,14 +61,14 @@
       </div>
 
       <div class="row">
-        <div class="ten columns offset-by-one"> <hr/> </div>
+        <div class="small-10 columns small-offset-1"> <hr/> </div>
       </div>
 
       {% include 'partial/add_note.html' %}
 
       {% if request.GET.thankyou == '' %}
       <div id=thankyou-wrapper class="row">
-        <div class="eight columns offset-by-two">
+        <div class="small-8 columns small-offset-2">
           <div id="thankyou">
             <p>
               Thank you for uploading
@@ -88,7 +89,7 @@
       {% endif %}
 
       <div class="row">
-        <div class="three columns centered">
+        <div class="small-8 columns large-4 small-centered">
           <div id="add-note-btn" data-id="{{ course.id }}">
             <i class=icon-upload></i> add a note
           </div>
@@ -97,7 +98,7 @@
 
 
       <div class="row">
-        <div class="ten columns offset-by-one"> <hr/> </div>
+        <div class="small-10 columns small-offset-1"> <hr/> </div>
       </div>
 
 
@@ -106,7 +107,7 @@
 
     <div id="course_container">
       <div class="row">
-        <div class="ten columns offset-by-one">
+        <div class="small-12 columns large-10 large-offset-1">
 
           {% for note in course.note_set.all %}
             {% include 'notes/note_list_entry.html' with note=note %}

diff --git a/karmaworld/templates/partial/add_note.html b/karmaworld/templates/partial/add_note.html
index c260736c40d9837744289836b071c2d6cd6b863c..c367448287f91d60870c39255585d284693f7fcf 100644 (file)
--- a/karmaworld/templates/partial/add_note.html
+++ b/karmaworld/templates/partial/add_note.html
@@ -10,31 +10,31 @@
     {% csrf_token %}
 
     <div class="row">
-      <div class="four columns offset-by-one upload-status" style="display:none">
+      <div class="small-8 small-offset-1 columns large-4 large-offset-1 upload-status" style="display:none">
         <legend><span id=add-note-status>Uploading</span> <span id=filename>note</span>...</legend>
         <div class=progress> <div id="progress-fill"></div> </div>
       </div>
-      <div id=file-uploader class="four columns offset-by-one">
+      <div id=file-uploader class="small-8 small-offset-1  columns large-4 large-offset-1">
         <!-- the upload button gets attached here -->
       </div> 
-      <div class="one columns offset-by-five end">
+      <div class="small-2 columns large-1 end">
         <i class="icon-remove-sign awesome-action"></i>
       </div>
     </div>
     <div class="row">
-      <div class="eight columns offset-by-one">
+      <div class="small-10 small-offset-1 columns large-8 large-offset-1">
         <legend>Title of Note <small class="form">* Required</small></legend>
         <input type="text" class="intext" id="id_name" name="name"
             placeholder="ENG 102 - Chaucer to Shakespeare">
       </div>
-      <div class="two columns end">
+      <div class="small-10 small-offset-1 columns large-2 large-offset-0 end">
         <legend>Academic Year</legend>
         <input type="text" class="" id="id_year" name="year"
             placeholder="2013"> {# FIXME: fill in with current year #}
       </div>
     </div>
     <div class="row">
-      <div class="ten columns offset-by-one end">
+      <div class="small-10 small-offset-1 columns large-8 large-offset-1">
         <legend>Tags (comma seperated)</legend>
         <input type="text" id="id_tags" name="tags" class="taggit-tags"
               placeholder="Chaucer, Shakespeare, literature, review">
@@ -42,7 +42,7 @@
     </div>
 
     <div class="row">
-      <div class="three columns centered">
+      <div class="small-8 small-offset-1 columns large-4 small-centered">
         <div id="save-btn" class="disabled">
           <i class=icon-save></i> Save
         </div>