Added lectures and solutions in epandable lists

templates/info.html

@@ -1,4 +1,22 @@
 <%inherit file="main.html" />
+
+<%block name="js_extra">
+<script>
+
+$(document).ready(function(){
+   //if(!page) {
+   //  cookie_page = $.cookie("book_page");
+   //  if(cookie_page) {
+   //    goto_page(cookie_page);
+   //  }
+   //}
+
+   $(".handouts ol").treeview({collapsed:true, unique:true/*, cookieId: "treeview-book-nav", persist: "cookie"*/});
+});
+
+</script>
+</%block>
+
 <%block name="title"><title>Course Info - MITx 6.002x</title></%block>
 
 <%include file="navigation.html" args="active_page='info'" />

templates/sass/_info.scss

@@ -78,17 +78,66 @@ div.info-wrapper {
 
     ol {
       list-style: none;
+      background: none;
 
       li {
         @include box-shadow(0 1px 0 #eee);
         border-bottom: 1px solid #d3d3d3;
+        @include box-sizing(border-box);
         @extend .clearfix;
         padding: 7px lh(.75);
+        background: none;
+        position: relative;
+
+        &.expandable,
+        &.collapsable {
+          h4 {
+            padding-left: 18px;
+            font-style: $body-font-size;
+            font-weight: normal;
+          }
+        }
+
+        ul {
+          background: none;
+          margin: 7px (-(lh(.75))) 0;
+
+          li {
+            padding-left: 18px + lh(.75);
+            @include box-shadow(inset 0 1px 0 #eee);
+            border-top: 1px solid #d3d3d3;
+            border-bottom: 0;
+          }
+        }
 
         &:hover {
           background-color: #e9e9e9;
         }
 
+        div.hitarea {
+          background-image: url('/static/images/treeview-default.gif');
+          width: 100%;
+          height: 100%;
+          max-height: 20px;
+          display: block;
+          position: absolute;
+          left: lh(.75);
+          margin-left: 0;
+
+          &:hover {
+            opacity: 0.6;
+            filter: alpha(opacity=60);
+          }
+
+          &.expandable-hitarea {
+            background-position: -80px 1px;
+          }
+
+          &.collapsable-hitarea {
+            background-position: -64px -21px;
+          }
+        }
+
         h3 {
           border-bottom: 0;
           text-transform: uppercase;