merged in wiki design changes

accordion_init.js

@@ -1,5 +1,5 @@
 $("#accordion").accordion({
-  active:${ active_chapter },
+  active: ${ active_chapter },
   autoHeight: false
 });
 

sass/_base-extends.scss

@@ -30,3 +30,83 @@
     border: 1px solid darken(#888, 20%);
   }
 }
+
+.content {
+  @include box-sizing(border-box);
+  display: table-cell;
+  padding: $body-line-height;
+  vertical-align: top;
+  width: grid-width(9);
+}
+
+.sidebar {
+  @include box-shadow( inset -1px 0 0 #f6f6f6);
+  background: #e3e3e3;
+  border-right: 1px solid #d3d3d3;
+  display: table-cell;
+  font-family: $body-font-family;
+  text-shadow: 0 1px 0 #f1f1f1;
+  vertical-align: top;
+  width: grid-width(3);
+  position: relative;
+
+  h3 {
+    @include box-shadow(0 1px 0 #eee);
+    background: none;
+    border: none;
+    border-bottom: 1px solid #d3d3d3;
+    color: #000;
+    font-weight: normal;
+    margin: 0;
+    overflow: hidden;
+
+    a {
+      @include transition();
+      color: lighten($text-color, 10%);
+      display: block;
+      font-size: $body-font-size;
+      padding: 7px 7px 7px 30px;
+      text-decoration: none;
+
+      &:hover {
+        @include box-shadow(0 1px 0 #fff);
+        background: #efefef;
+      }
+    }
+
+    span.ui-icon {
+      background-image: url(images/ui-icons_454545_256x240.png);
+    }
+
+    &.active {
+      @include box-shadow(none);
+      background: none;
+      border: 0;
+      border-bottom: 1px solid #bbb;
+      color: #000;
+      font-weight: bold;
+
+      a {
+        color: #000;
+      }
+    }
+  }
+}
+
+.topbar {
+  background: #F6EFD4;
+  border-bottom: 1px solid darken(#F6EFD4, 10%);
+  margin: (-$body-line-height) (-$body-line-height) $body-line-height;
+  font-size: 12px;
+  text-shadow: 0 1px 0 #fff;
+  @extend .clearfix;
+
+  a {
+    text-transform: uppercase;
+    color: darken(#F6EFD4, 80%);
+
+    &:hover {
+      color: darken(#F6EFD4, 60%);
+    }
+  }
+}

sass/_courseware.scss

@@ -3,15 +3,7 @@ div.course-wrapper {
   width: 100%;
 
   div#accordion {
-    @include box-shadow( inset -1px 0 0 #f6f6f6);
-    background: #e3e3e3;
-    border-right: 1px solid #d3d3d3;
-    display: table-cell;
-    font-family: $body-font-family;
-    overflow: hidden;
-    text-shadow: 0 1px 0 #f1f1f1;
-    vertical-align: top;
-    width: grid-width(3);
+    @extend .sidebar;
 
     h3 {
       overflow: hidden;
@@ -29,34 +21,13 @@ div.course-wrapper {
           color: lighten($text-color, 10%);
         }
 
-        &.ui-state-default {
-          @include box-shadow(0 1px 0 #eee);
-          background: none;
-          border: none;
-          border-bottom: 1px solid #d3d3d3;
-          font-weight: normal;
-
-          span.ui-icon {
-            background-image: url(images/ui-icons_454545_256x240.png);
-          }
-        }
-
         &.ui-state-hover {
           border: none;
           border-bottom: 1px solid #d3d3d3;
         }
 
         &.ui-state-active {
-          @include box-shadow(none);
-          background: none;
-          border: 0;
-          border-bottom: 1px solid #bbb;
-          color: #000;
-          font-weight: bold;
-
-          a {
-            color: #000;
-          }
+          @extend .active;
         }
       }
     }
@@ -127,6 +98,7 @@ div.course-wrapper {
       margin-bottom: $body-line-height;
 
       li {
+        border: none;
         cursor: pointer;
         display: table-cell;
         min-width: 30px;
@@ -138,7 +110,7 @@ div.course-wrapper {
     div.video-wrapper {
       float: left;
       width: 640px;
-      min-height: 500px;
+      min-height: 620px;
 
       section {
         ul {
@@ -148,6 +120,8 @@ div.course-wrapper {
             margin-top: 5px;
             display: inline-block;
             cursor: pointer;
+            border: 0;
+            padding: 0;
 
             div {
               &:empty {
@@ -186,9 +160,13 @@ div.course-wrapper {
       li {
         margin-bottom: 8px;
         cursor: pointer;
+        border: 0;
+        padding: 0;
+        color: #666;
 
         &.current {
           background-color: #f3f3f3;
+          color: #333;
         }
 
         &:hover {

sass/_textbook.scss

@@ -2,17 +2,9 @@ div.book-wrapper {
   display: table;
 
   ul#booknav {
-    @include box-shadow( inset -1px 0 0 #f6f6f6);
+    @extend .sidebar;
     @include box-sizing(border-box);
-    background: #e3e3e3;
-    border-right: 1px solid #d3d3d3;
-    font-family: $body-font-family;
     padding: $body-line-height;
-    text-shadow: 0 1px 0 #f6f6f6;
-    vertical-align: top;
-    width: grid-width(3);
-    min-width: 240px;
-    display: table-cell;
 
     li {
       ul {
@@ -29,9 +21,7 @@ div.book-wrapper {
     display: table-cell;
 
     nav {
-      background: #F6EFD4;
-      border-bottom: 1px solid darken(#F6EFD4, 10%);
-      margin: (-$body-line-height) (-$body-line-height) $body-line-height;
+      @extend .topbar;
 
       ul {
         @extend .clearfix;
@@ -45,17 +35,6 @@ div.book-wrapper {
           &.next {
             float: right;
           }
-
-          a {
-            font-size: 12px;
-            text-transform: uppercase;
-            color: darken(#F6EFD4, 80%);
-            text-shadow: 0 1px 0 #fff;
-
-            &:hover {
-              color: darken(#F6EFD4, 60%);
-            }
-          }
         }
       }
     }

sass/_wiki-create.scss

@@ -0,0 +1,22 @@
+form#wiki_revision {
+  label {
+    display: block;
+    margin-bottom: 7px ;
+  }
+
+  textarea {
+    @include box-sizing(border-box);
+    margin-bottom: 20px;
+    min-height: 300px;
+    width: 100%;
+  }
+
+  input[type="text"] {
+    width: 50%;
+  }
+
+  input[type="submit"] {
+    display: block;
+    margin-top: 20px;
+  }
+}

sass/_wiki.scss

@@ -0,0 +1,134 @@
+div.wiki-wrapper {
+  display: table;
+  width: 100%;
+
+  div#wiki_panel {
+    @extend .sidebar;
+    overflow: auto;
+
+    input[type="button"] {
+      @extend h3;
+      color: lighten($text-color, 10%);
+      @include transition();
+      font-size: $body-font-size;
+      margin: 0  !important;
+      padding: 7px 7px 7px 30px;
+      text-align: left;
+      width: 100%;
+
+      &:hover {
+        @include box-shadow(0 1px 0 #fff);
+        background: #efefef;
+      }
+    }
+
+    ul {
+      li {
+        &.create-article {
+          position: relative;
+
+          h3 {
+            position: relative;
+
+            &:before {
+              background: blue  url(images/ui-icons_454545_256x240.png) -32px -16px no-repeat;
+              display: block;
+              position: absolute;
+              top: 0;
+              right: 0;
+              width: 16px;
+              height: 16px;
+            }
+
+            &:hover {
+              &:before {
+                background-image: url(images/ui-icons_454545_256x240.png) -64px -16px no-repeat;
+              }
+            }
+          }
+        }
+      }
+    }
+    div#wiki_create_form {
+      @extend .clearfix;
+      padding: 15px;
+      background: #d6d6d6;
+      border-bottom: 1px solid #bbb;
+
+      input[type="text"] {
+        margin-bottom: 6px;
+        display: block;
+        width: 100%;
+        @include box-sizing(border-box);
+      }
+
+      ul {
+        li {
+          float: left;
+
+          &#cancel {
+            float: right;
+            margin-top: 10px;
+          }
+        }
+      }
+    }
+  }
+
+  section.wiki-body {
+    @extend .content;
+
+    header {
+      @extend .topbar;
+
+      p {
+        float: left;
+        padding: 15px;
+        margin-bottom: 0;
+        color: darken(#F6EFD4, 55%);
+        line-height: 1em;
+      }
+
+      ul {
+        float: right;
+
+        li {
+          float: left;
+
+          input[type="button"] {
+            @include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
+            @include border-radius(0);
+            @include transition();
+            background: darken(#F6EFD4, 5%);
+            border: 0;
+            border-left: 1px solid darken(#f6efd4, 20%);
+            color: darken(#F6EFD4, 80%);
+            text-shadow: none;
+            font-weight: normal;
+            font-size: 12px;
+            text-transform: uppercase;
+            letter-spacing: 1px;
+            padding: 15px;
+            margin: 0;
+
+            &:hover {
+              background: none;
+            }
+          }
+        }
+      }
+    }
+
+    h1.wiki-title {
+      font-weight: bold;
+      padding-bottom: 10px;
+      margin-bottom: 20px;
+      border-bottom: 1px solid #ccc;
+    }
+
+    p {
+      line-height: 1.6em;
+    }
+
+  }
+}

sass/application.scss

@@ -10,6 +10,7 @@
 @import "courseware";
 @import "textbook";
 @import "profile";
+@import "wiki-create", "wiki";
 
 // left over
 @import "theme";

simplewiki_base.html

@@ -5,73 +5,81 @@
 <%block name="title"><title>${"wiki_title"}</title></%block>
 
 <%block name="headextra">
-<link rel="stylesheet" media="screen,print" href="/static/simplewiki/css/base.css" />
-<link rel="stylesheet" media="print" href="/static/simplewiki/css/base_print.css" />
-<link rel="stylesheet" href="/static/simplewiki/css/autosuggest_inquisitor.css" />
-<link rel="stylesheet" href="/static/css/local.css" type="text/css" media="all" />
-<script type="text/javascript" src="/static/simplewiki/js/bsn.AutoSuggest_c_2.0.js"></script>
+  <!-- <link rel="stylesheet" media="screen,print" href="/static/simplewiki/css/base.css" /> -->
+  <!-- <link rel="stylesheet" media="print" href="/static/simplewiki/css/base_print.css" /> -->
+  <!-- <link rel="stylesheet" href="/static/simplewiki/css/autosuggest_inquisitor.css" /> -->
+  <!-- <link rel="stylesheet" href="/static/css/local.css" type="text/css" media="all" /> -->
+  <script type="text/javascript" src="/static/simplewiki/js/bsn.AutoSuggest_c_2.0.js"></script>
 
-<%!
-    from django.core.urlresolvers import reverse
-%>
+  <%!
+      from django.core.urlresolvers import reverse
+  %>
 
-<script type="text/javascript">
-	function set_related_article_id(s) {
-		document.getElementById('wiki_related_input_id').value = s.id;
-		document.getElementById('wiki_related_input_submit').disabled=false;
-	}
-	%if wiki_article is not UNDEFINED:
-	var x = window.onload;
-	window.onload = function(){
-			var options = {
-			script: "${reverse("search_related", args=[wiki_article.get_url()] )}/?self=${wiki_article.pk}&",
-			json: true,
-			varname: "query",
-			maxresults: 35,
-			callback: set_related_article_id,
-			noresults: "Nothing found!"
-		};
-		var as = new AutoSuggest('wiki_related_input', options);
-		if (typeof x == 'function')
-			x();
-	}
-	%endif
-</script>
-<script type="text/x-mathjax-config">
-  MathJax.Hub.Config({
-    tex2jax: {inlineMath: [ ['$','$'], ["\\(","\\)"]],
-              displayMath: [ ['$$','$$'], ["\\[","\\]"]]}
+  <script type="text/javascript">
+    function set_related_article_id(s) {
+      document.getElementById('wiki_related_input_id').value = s.id;
+      document.getElementById('wiki_related_input_submit').disabled=false;
+    }
+    %if wiki_article is not UNDEFINED:
+    var x = window.onload;
+    window.onload = function(){
+        var options = {
+        script: "${reverse("search_related", args=[wiki_article.get_url()] )}/?self=${wiki_article.pk}&",
+        json: true,
+        varname: "query",
+        maxresults: 35,
+        callback: set_related_article_id,
+        noresults: "Nothing found!"
+      };
+      var as = new AutoSuggest('wiki_related_input', options);
+      if (typeof x == 'function')
+        x();
+    }
+    %endif
+  </script>
+  <script type="text/x-mathjax-config">
+    MathJax.Hub.Config({
+      tex2jax: {inlineMath: [ ['$','$'], ["\\(","\\)"]],
+                displayMath: [ ['$$','$$'], ["\\[","\\]"]]}
+    });
+  </script> <script type="text/javascript" src="/static/lib/mathjax/MathJax.js?config=TeX-AMS_HTML-full"></script> 
+  <script>
+  $(function(){
+  $.ajaxSetup ({
+      // Disable caching of AJAX responses
+      cache: false
   });
-</script> <script type="text/javascript" src="/static/lib/mathjax/MathJax.js?config=TeX-AMS_HTML-full"></script> 
-<script>
-$(function(){
-$.ajaxSetup ({
-    // Disable caching of AJAX responses
-    cache: false
-});
 
-$(".div_wiki_circuit").each(function(d,e) {
-   id = $(this).attr("id");
-   name = id.substring(17);
-   //alert(name);
-   $("#"+id).load("/edit_circuit/"+name);
-   f=this;
-});
+  $(".div_wiki_circuit").each(function(d,e) {
+     id = $(this).attr("id");
+     name = id.substring(17);
+     //alert(name);
+     $("#"+id).load("/edit_circuit/"+name);
+     f=this;
+  });
+
+  $("#wiki_create_form").hide();
+
+  $("#create-article").click(function() {
+      $("#wiki_create_form").slideToggle();
+      $(this).parent().toggleClass("active");
+  });
+
+  update_schematics();});
+  </script>
 
-update_schematics();});
-</script>
-<%block name="wiki_head"/>
-</%block>
 
 <%block name="bodyextra">
+  <%block name="wiki_head"/>
+</%block>
 
 <%include file="navigation.html" />
 
 <section class="main-content">
-	<h1><%block name="wiki_page_title"/></h1>
-	<hr />
+  <div class="wiki-wrapper">
+      <%block name="wiki_panel">
 
-	<%block name="wiki_panel">
+    <div id="wiki_panel">
     <%
         if (wiki_article is not UNDEFINED):
         	baseURL = reverse("wiki_view", args=[wiki_article.get_url()])
@@ -79,13 +87,8 @@ update_schematics();});
         	baseURL = reverse("wiki_view", args=[""])
     %>
 
-	<div id="wiki_panel">
-    	<div class="wiki_box">
-    	    <div class="wiki_box_header">
-    	            <div class="wiki_box_corner"></div>
-    	            <div class="wiki_box_bar"></div>
-    	    </div>
-    	    <div class="wiki_box_contents">
+      <ul class="action">
+        <li>
     	            <div class="wiki_box_title">Search</div>
     	        <form method="POST" action='${reverse("wiki_search_articles", args=[""])}'>
     	            <div style="display:none">
@@ -94,68 +97,81 @@ update_schematics();});
     	            <input type="text" name="value" id="wiki_search_input" style="width: 72%" value="${wiki_search_query if wiki_search_query is not UNDEFINED else '' |h}"/>
     	            <input type="submit" id="wiki_search_input_submit" value=Go! style="width: 20%" />
     	        </form>
-    	    </div>
-    	    <div class="wiki_box_footer">
-    	            <div class="wiki_box_corner"></div>
-    	            <div class="wiki_box_bar"></div>
-    	    </div>
-    	</div>
-    	
-	    <div class="wiki_box">
-	    	<div class="wiki_box_header">
-	    		<div class="wiki_box_corner"></div>
-	    		<div class="wiki_box_bar"></div>
-	    	</div>
-	    	<div class="wiki_box_contents" style="position: relative;">
+        </li>
+        <li>
+          <input type="button" onclick="javascript:location.href='${reverse("wiki_random", args=["wiki_articleget_url"])}'" value="Random article" class="button" />
+        </li>
 
-	    	<div style="border: 2px outset #CCC; width: 250px; padding: 10px; background-color: #FFF; position: absolute; right: 100px; top: -80px; display: none; color: #000;" id="wiki_create_form">
-				<%
-					theaction = "this.wiki_article_name.value.replace(/([^a-zA-Z0-9\-])/g, '')+'/_create/'"
-				%>
-	    		<form method="GET" onsubmit="this.action='${baseURL + "/' + " + theaction};">
-	    			<h2>Create article</h2>
-	    			<p>
-	    			    <label for="id_wiki_article_name">Title of article</label>
-	    			    <input type="text" name="wiki_article_name" id="id_wiki_article_name" /><br/>
-	    			    <label for="id_wiki_article_is_child">Create as a child of current article</label>
-	    			    <input type="checkbox" name="wiki_article_is_child" id="id_wiki_artcile_is_child" disabled="true" ${ 'checked="checked"' if wiki_article is not UNDEFINED else ""}>
-	    			</p>
-	    			<p>
-	    				<input type="button" class="button" value="Cancel" style="display: inline-block; margin-right: 2px;" onclick="document.getElementById('wiki_create_form').style.display='none';" />
-	    				<input type="submit" class="button" value="Next &gt;" style="display: inline-block; margin-right: 2px; font-weight: bold;" />
-	    			</p>
-	    		</form>
-	    	</div>
-	    	<p>
-    	
-		    %if wiki_article is not UNDEFINED:
-	    	    <input type="button" onclick="javascript:location.href='${reverse("wiki_view", args=[wiki_article.get_url()])}'" value="View" style="width: 100%;" class="button"  /><br />
-	    	    <input type="button" onclick="javascript:location.href='${reverse("wiki_edit", args=[wiki_article.get_url()])}'" value="Edit" style="width: 100%;" class="button" ${'disabled="true"' if not wiki_write else ""}/><br />
-	    	    <input type="button" onclick="javascript:location.href='${reverse("wiki_history", args=[wiki_article.get_url(),1])}'" value="History" style="width: 100%;" class="button" />
-	    	%endif
-	    	<input type="button" onclick="document.getElementById('wiki_create_form').style.display='block';" value="Create article" style="width: 100%; margin-bottom: 2px;" class="button" />
-	    	<input type="button" onclick="javascript:location.href='${reverse("wiki_random", args=["wiki_articleget_url"])}'" value="Random article" style="width: 100%; margin-bottom: 2px;" class="button" />
-	    	</p>
-			%if wiki_article is not UNDEFINED:
-				%if wiki_article.locked:
-				<p><strong>This article has been locked</strong></p>
-				%endif
-				<p>
-	    	        <i>Last modified: ${wiki_article.modified_on.strftime("%b %d, %Y, %I:%M %p")}</i>
-	    	    </p>
-			%endif
-	    	</div>
-	    	<div class="wiki_box_footer">
-	    		<div class="wiki_box_corner"></div>
-	    		<div class="wiki_box_bar"></div>
-	    	</div>
-	    </div>
+        <li class="create-article">
+          <h3>
+            <a href="#" id="create-article"/>Create Article</a>
+          </h3>
 
-	</div>
+          <div id="wiki_create_form">
+            <%
+              theaction = "this.wiki_article_name.value.replace(/([^a-zA-Z0-9\-])/g, '')+'/_create/'"
+              if (wiki_article is not UNDEFINED):
+                baseURL = reverse("wiki_view", args=[wiki_article.get_url()])
+              else:
+                baseURL = reverse("wiki_view", args=[""])
+            %>
 
-	</%block>
+            <form method="GET" onsubmit="this.action='${baseURL + "/' + " + theaction};">
 
-	<%block name="wiki_body"/>
+              <div>
+                <label for="id_wiki_article_name">Title of article</label>
+                <input type="text" name="wiki_article_name" id="id_wiki_article_name" /><br/>
+                <!-- <label for="id_wiki_article_is_child">Create as a child of current article</label> -->
+                <!-- <input type="checkbox" name="wiki_article_is_child" id="id_wiki_artcile_is_child" disabled="true" ${ 'checked="checked"' if wiki_article is not UNDEFINED else ""}> -->
+              </div>
+
+              <ul>
+
+                <li>
+                  <input type="submit" class="button" value="Create" style="display: inline-block; margin-right: 2px; font-weight: bold;" />
+                </li>
+
+              </ul>
+            </form>
+          </div>
+        </li>
+      </ul>
+
+    </div>
+    </%block>
+
+    <section class="wiki-body">
+      <header>
+        %if wiki_article is not UNDEFINED:
+          %if wiki_article.locked:
+            <p><strong>This article has been locked</strong></p>
+          %endif
+            <p>Last modified: ${wiki_article.modified_on.strftime("%b %d, %Y, %I:%M %p")}</p>
+          %endif
+
+        %if wiki_article is not UNDEFINED:
+        <ul>
+
+          <li>
+            <input type="button" onclick="javascript:location.href='${reverse("wiki_view", args=[wiki_article.get_url()])}'" value="View" />
+          </li>
+
+          <li>
+            <input type="button" onclick="javascript:location.href='${reverse("wiki_edit", args=[wiki_article.get_url()])}'" value="Edit" ${'disabled="true"' if not wiki_write else ""}/>
+          </li>
+
+          <li>
+            <input type="button" onclick="javascript:location.href='${reverse("wiki_history", args=[wiki_article.get_url(),1])}'" value="History" class="button" />
+          </li>
+        </ul>
+        %endif
+      </header>
+
+      <h1 class="wiki-title"><%block name="wiki_page_title"/></h1>
+
+      <%block name="wiki_body"/>
+    </section>
+  </div>
 </section>
 
 </%block>

simplewiki_base.html.orig

@@ -0,0 +1,177 @@
+##This file is based on the template from the SimpleWiki source which carries the GPL license
+
+<%inherit file="main.html"/>
+
+<%block name="title"><title>${"wiki_title"}</title></%block>
+
+<%block name="headextra">
+  <!-- <link rel="stylesheet" media="screen,print" href="/static/simplewiki/css/base.css" /> -->
+  <!-- <link rel="stylesheet" media="print" href="/static/simplewiki/css/base_print.css" /> -->
+  <!-- <link rel="stylesheet" href="/static/simplewiki/css/autosuggest_inquisitor.css" /> -->
+  <!-- <link rel="stylesheet" href="/static/css/local.css" type="text/css" media="all" /> -->
+  <script type="text/javascript" src="/static/simplewiki/js/bsn.AutoSuggest_c_2.0.js"></script>
+
+  <%!
+      from django.core.urlresolvers import reverse
+  %>
+
+  <script type="text/javascript">
+    function set_related_article_id(s) {
+      document.getElementById('wiki_related_input_id').value = s.id;
+      document.getElementById('wiki_related_input_submit').disabled=false;
+    }
+    %if wiki_article is not UNDEFINED:
+    var x = window.onload;
+    window.onload = function(){
+        var options = {
+        script: "${reverse("search_related", args=[wiki_article.get_url()] )}/?self=${wiki_article.pk}&",
+        json: true,
+        varname: "query",
+        maxresults: 35,
+        callback: set_related_article_id,
+        noresults: "Nothing found!"
+      };
+      var as = new AutoSuggest('wiki_related_input', options);
+      if (typeof x == 'function')
+        x();
+    }
+    %endif
+  </script>
+  <script type="text/x-mathjax-config">
+    MathJax.Hub.Config({
+      tex2jax: {inlineMath: [ ['$','$'], ["\\(","\\)"]],
+                displayMath: [ ['$$','$$'], ["\\[","\\]"]]}
+    });
+  </script> <script type="text/javascript" src="/static/lib/mathjax/MathJax.js?config=TeX-AMS_HTML-full"></script> 
+  <script>
+  $(function(){
+  $.ajaxSetup ({
+      // Disable caching of AJAX responses
+      cache: false
+  });
+
+  $(".div_wiki_circuit").each(function(d,e) {
+     id = $(this).attr("id");
+     name = id.substring(17);
+     //alert(name);
+     $("#"+id).load("/edit_circuit/"+name);
+     f=this;
+  });
+
+  $("#wiki_create_form").hide();
+
+  $("#create-article").click(function() {
+      $("#wiki_create_form").slideToggle();
+      $(this).parent().toggleClass("active");
+  });
+
+  update_schematics();});
+  </script>
+
+
+<%block name="bodyextra">
+  <%block name="wiki_head"/>
+</%block>
+
+<%include file="navigation.html" />
+
+<section class="main-content">
+  <div class="wiki-wrapper">
+      <%block name="wiki_panel">
+
+    <div id="wiki_panel">
+    <%
+        if (wiki_article is not UNDEFINED):
+        	baseURL = reverse("wiki_view", args=[wiki_article.get_url()])
+        else:
+        	baseURL = reverse("wiki_view", args=[""])
+    %>
+
+      <ul class="action">
+        <li>
+    	            <div class="wiki_box_title">Search</div>
+    	        <form method="POST" action='${reverse("wiki_search_articles", args=[""])}'>
+    	            <div style="display:none">
+                	    <input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}"/>
+                	</div>
+    	            <input type="text" name="value" id="wiki_search_input" style="width: 72%" value="${wiki_search_query if wiki_search_query is not UNDEFINED else '' |h}"/>
+    	            <input type="submit" id="wiki_search_input_submit" value=Go! style="width: 20%" />
+    	        </form>
+        </li>
+        <li>
+          <input type="button" onclick="javascript:location.href='${reverse("wiki_random", args=["wiki_articleget_url"])}'" value="Random article" class="button" />
+        </li>
+
+        <li class="create-article">
+          <h3>
+            <a href="#" id="create-article"/>Create Article</a>
+          </h3>
+
+          <div id="wiki_create_form">
+            <%
+              theaction = "this.wiki_article_name.value.replace(/([^a-zA-Z0-9\-])/g, '')+'/_create/'"
+              if (wiki_article is not UNDEFINED):
+                baseURL = reverse("wiki_view", args=[wiki_article.get_url()])
+              else:
+                baseURL = reverse("wiki_view", args=[""])
+            %>
+
+            <form method="GET" onsubmit="this.action='${baseURL + "/' + " + theaction};">
+
+              <div>
+                <label for="id_wiki_article_name">Title of article</label>
+                <input type="text" name="wiki_article_name" id="id_wiki_article_name" /><br/>
+                <!-- <label for="id_wiki_article_is_child">Create as a child of current article</label> -->
+                <!-- <input type="checkbox" name="wiki_article_is_child" id="id_wiki_artcile_is_child" disabled="true" ${ 'checked="checked"' if wiki_article is not UNDEFINED else ""}> -->
+              </div>
+
+              <ul>
+
+                <li>
+                  <input type="submit" class="button" value="Create" style="display: inline-block; margin-right: 2px; font-weight: bold;" />
+                </li>
+
+              </ul>
+            </form>
+          </div>
+        </li>
+      </ul>
+
+    </div>
+    </%block>
+
+    <section class="wiki-body">
+      <header>
+        %if wiki_article is not UNDEFINED:
+          %if wiki_article.locked:
+            <p><strong>This article has been locked</strong></p>
+          %endif
+            <p>Last modified: ${wiki_article.modified_on.strftime("%b %d, %Y, %I:%M %p")}</p>
+          %endif
+
+        %if wiki_article is not UNDEFINED:
+        <ul>
+
+          <li>
+            <input type="button" onclick="javascript:location.href='${reverse("wiki_view", args=[wiki_article.get_url()])}'" value="View" />
+          </li>
+
+          <li>
+            <input type="button" onclick="javascript:location.href='${reverse("wiki_edit", args=[wiki_article.get_url()])}'" value="Edit" ${'disabled="true"' if not wiki_write else ""}/>
+          </li>
+
+          <li>
+            <input type="button" onclick="javascript:location.href='${reverse("wiki_history", args=[wiki_article.get_url(),1])}'" value="History" class="button" />
+          </li>
+        </ul>
+        %endif
+      </header>
+
+      <h1 class="wiki-title"><%block name="wiki_page_title"/></h1>
+
+      <%block name="wiki_body"/>
+    </section>
+  </div>
+</section>
+
+</%block>

simplewiki_create.html

@@ -5,17 +5,15 @@
 <%block name="wiki_page_title">
 Create article
 </%block>
+
 <%block name="wiki_body">
 <form method="POST" id="wiki_revision">
-	<div style="display:none">
-	    <input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}"/>
-	</div>
-	<table id="wiki_revision_table">
-	${ wiki_form }
-	<tr>
-		<td colspan="2" align="right">
-			<input type="submit" value="Create article" /></td>
-	</tr>
-	</table>
+  <div style="display:none">
+    <input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}"/>
+  </div>
+
+  ${ wiki_form }
+
+  <input type="submit" value="Create article" /></td>
 </form>
 </%block>

simplewiki_edit.html

@@ -11,12 +11,9 @@ ${ wiki_article.title }
 	<div style="display:none">
 	    <input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}"/>
 	</div>
-	<table id="wiki_revision_table">
-	${wiki_form}
-	<tr>
-		<td colspan="2" align="right">
-			<input type="submit" value="Edit article" /></td>
-	</tr>
-	</table>
+
+  ${wiki_form}
+
+  <input type="submit" value="Edit article" /></td>
 </form>
 </%block>

simplewiki_view.html

@@ -3,11 +3,11 @@
 <%inherit file="simplewiki_base.html"/>
 
 <%block name="wiki_page_title">
-${ wiki_article.title }
+  ${ wiki_article.title }
 </%block>
-<%block name="wiki_body">
 
-<div id="wiki_article">
-	${ wiki_article.current_revision.contents_parsed| n}
-</div>
+<%block name="wiki_body">
+  <div id="wiki_article">
+    ${ wiki_article.current_revision.contents_parsed| n}
+  </div>
 </%block>