Skip to content

E
edx-platform
Commit 741d1741 by Kyle Fiedler
Options

Added structure and style for most of the wiki 

--HG--
branch : kf-wiki
parent 61a713f2
Showing with 409 additions and 200 deletions
.DS_Store
No preview for this file type
accordion_init.js
$("#accordion").accordion({ $("#accordion").accordion({
active:${ active_chapter }, active: ${ active_chapter },
autoHeight: false autoHeight: false
}); });
......
sass/_base-extends.scss
...@@ -30,3 +30,83 @@ ...@@ -30,3 +30,83 @@
border: 1px solid darken(#888, 20%); 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 { ...@@ -3,15 +3,7 @@ div.course-wrapper {
width: 100%; width: 100%;
div#accordion { div#accordion {
@include box-shadow( inset -1px 0 0 #f6f6f6); @extend .sidebar;
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);
h3 { h3 {
overflow: hidden; overflow: hidden;
...@@ -29,34 +21,13 @@ div.course-wrapper { ...@@ -29,34 +21,13 @@ div.course-wrapper {
color: lighten($text-color, 10%); 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 { &.ui-state-hover {
border: none; border: none;
border-bottom: 1px solid #d3d3d3; border-bottom: 1px solid #d3d3d3;
} }
&.ui-state-active { &.ui-state-active {
@include box-shadow(none); @extend .active;
background: none;
border: 0;
border-bottom: 1px solid #bbb;
color: #000;
font-weight: bold;
a {
color: #000;
}
} }
} }
} }
...@@ -127,6 +98,7 @@ div.course-wrapper { ...@@ -127,6 +98,7 @@ div.course-wrapper {
margin-bottom: $body-line-height; margin-bottom: $body-line-height;
li { li {
border: none;
cursor: pointer; cursor: pointer;
display: table-cell; display: table-cell;
min-width: 30px; min-width: 30px;
...@@ -138,7 +110,7 @@ div.course-wrapper { ...@@ -138,7 +110,7 @@ div.course-wrapper {
div.video-wrapper { div.video-wrapper {
float: left; float: left;
width: 640px; width: 640px;
min-height: 500px; min-height: 620px;
section { section {
ul { ul {
...@@ -148,6 +120,8 @@ div.course-wrapper { ...@@ -148,6 +120,8 @@ div.course-wrapper {
margin-top: 5px; margin-top: 5px;
display: inline-block; display: inline-block;
cursor: pointer; cursor: pointer;
border: 0;
padding: 0;
div { div {
&:empty { &:empty {
...@@ -186,9 +160,13 @@ div.course-wrapper { ...@@ -186,9 +160,13 @@ div.course-wrapper {
li { li {
margin-bottom: 8px; margin-bottom: 8px;
cursor: pointer; cursor: pointer;
border: 0;
padding: 0;
color: #666;
&.current { &.current {
background-color: #f3f3f3; background-color: #f3f3f3;
color: #333;
} }
&:hover { &:hover {
......
sass/_textbook.scss
...@@ -2,17 +2,9 @@ div.book-wrapper { ...@@ -2,17 +2,9 @@ div.book-wrapper {
display: table; display: table;
ul#booknav { ul#booknav {
@include box-shadow( inset -1px 0 0 #f6f6f6); @extend .sidebar;
@include box-sizing(border-box); @include box-sizing(border-box);
background: #e3e3e3;
border-right: 1px solid #d3d3d3;
font-family: $body-font-family;
padding: $body-line-height; padding: $body-line-height;
text-shadow: 0 1px 0 #f6f6f6;
vertical-align: top;
width: grid-width(3);
min-width: 240px;
display: table-cell;
li { li {
ul { ul {
...@@ -29,9 +21,7 @@ div.book-wrapper { ...@@ -29,9 +21,7 @@ div.book-wrapper {
display: table-cell; display: table-cell;
nav { nav {
background: #F6EFD4; @extend .topbar;
border-bottom: 1px solid darken(#F6EFD4, 10%);
margin: (-$body-line-height) (-$body-line-height) $body-line-height;
ul { ul {
@extend .clearfix; @extend .clearfix;
...@@ -45,17 +35,6 @@ div.book-wrapper { ...@@ -45,17 +35,6 @@ div.book-wrapper {
&.next { &.next {
float: right; 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 → 100644
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 → 100644
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 @@ ...@@ -10,6 +10,7 @@
@import "courseware"; @import "courseware";
@import "textbook"; @import "textbook";
@import "profile"; @import "profile";
@import "wiki-create", "wiki";
// left over // left over
@import "theme"; @import "theme";
......
simplewiki_base.html
...@@ -5,135 +5,155 @@ ...@@ -5,135 +5,155 @@
<%block name="title"><title>${"wiki_title"}</title></%block> <%block name="title"><title>${"wiki_title"}</title></%block>
<%block name="headextra"> <%block name="headextra">
<link rel="stylesheet" media="screen,print" href="/static/simplewiki/css/base.css" /> <!-- <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" media="print" href="/static/simplewiki/css/base_print.css" /> -->
<link rel="stylesheet" href="/static/simplewiki/css/autosuggest_inquisitor.css" /> <!-- <link rel="stylesheet" href="/static/simplewiki/css/autosuggest_inquisitor.css" /> -->
<link rel="stylesheet" href="/static/css/local.css" type="text/css" media="all" /> <!-- <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> <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"> <script type="text/javascript">
function set_related_article_id(s) { function set_related_article_id(s) {
document.getElementById('wiki_related_input_id').value = s.id; document.getElementById('wiki_related_input_id').value = s.id;
document.getElementById('wiki_related_input_submit').disabled=false; document.getElementById('wiki_related_input_submit').disabled=false;
} }
%if wiki_article is not UNDEFINED: %if wiki_article is not UNDEFINED:
var x = window.onload; var x = window.onload;
window.onload = function(){ window.onload = function(){
var options = { var options = {
script: "${reverse("search_related", args=[wiki_article.get_url()] )}/?self=${wiki_article.pk}&", script: "${reverse("search_related", args=[wiki_article.get_url()] )}/?self=${wiki_article.pk}&",
json: true, json: true,
varname: "query", varname: "query",
maxresults: 35, maxresults: 35,
callback: set_related_article_id, callback: set_related_article_id,
noresults: "Nothing found!" noresults: "Nothing found!"
}; };
var as = new AutoSuggest('wiki_related_input', options); var as = new AutoSuggest('wiki_related_input', options);
if (typeof x == 'function') if (typeof x == 'function')
x(); x();
} }
%endif %endif
</script> </script>
<script type="text/x-mathjax-config"> <script type="text/x-mathjax-config">
MathJax.Hub.Config({ MathJax.Hub.Config({
tex2jax: {inlineMath: [ ['$','$'], ["\\(","\\)"]], tex2jax: {inlineMath: [ ['$','$'], ["\\(","\\)"]],
displayMath: [ ['$$','$$'], ["\\[","\\]"]]} 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;
}); });
</script> <script type="text/javascript" src="/static/lib/mathjax/MathJax.js?config=TeX-AMS_HTML-full"></script>
<script> $("#wiki_create_form").hide();
$(function(){
$.ajaxSetup ({ $("#create-article").click(function() {
// Disable caching of AJAX responses $("#wiki_create_form").slideToggle();
cache: false $(this).parent().toggleClass("active");
}); });
$(".div_wiki_circuit").each(function(d,e) { update_schematics();});
id = $(this).attr("id"); </script>
name = id.substring(17);
//alert(name);
$("#"+id).load("/edit_circuit/"+name);
f=this;
});
update_schematics();});
</script>
<%block name="wiki_head"/>
</%block>
<%block name="bodyextra"> <%block name="bodyextra">
<%block name="wiki_head"/>
</%block>
<%include file="navigation.html" /> <%include file="navigation.html" />
<section class="main-content"> <section class="main-content">
<h1><%block name="wiki_page_title"/></h1> <div class="wiki-wrapper">
<hr /> <%block name="wiki_panel">
<%block name="wiki_panel"> <div id="wiki_panel">
<div id="wiki_panel">
<div class="wiki_box"> <ul class="action">
<div class="wiki_box_header"> <li>
<div class="wiki_box_corner"></div> <input type="button" onclick="javascript:location.href='${reverse("wiki_random", args=["wiki_articleget_url"])}'" value="Random article" class="button" />
<div class="wiki_box_bar"></div> </li>
</div>
<div class="wiki_box_contents" style="position: relative;"> <li class="create-article">
<h3>
<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"> <a href="#" id="create-article"/>Create Article</a>
<% </h3>
theaction = "this.wiki_article_name.value.replace(/([^a-zA-Z0-9\-])/g, '')+'/_create/'"
if (wiki_article is not UNDEFINED): <div id="wiki_create_form">
baseURL = reverse("wiki_view", args=[wiki_article.get_url()]) <%
else: theaction = "this.wiki_article_name.value.replace(/([^a-zA-Z0-9\-])/g, '')+'/_create/'"
baseURL = reverse("wiki_view", args=[""]) if (wiki_article is not UNDEFINED):
baseURL = reverse("wiki_view", args=[wiki_article.get_url()])
%> else:
<form method="GET" onsubmit="this.action='${baseURL + "/' + " + theaction};"> baseURL = reverse("wiki_view", args=[""])
<h2>Create article</h2> %>
<p>
<label for="id_wiki_article_name">Title of article</label> <form method="GET" onsubmit="this.action='${baseURL + "/' + " + theaction};">
<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> <div>
<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 ""}> <label for="id_wiki_article_name">Title of article</label>
</p> <input type="text" name="wiki_article_name" id="id_wiki_article_name" /><br/>
<p> <!-- <label for="id_wiki_article_is_child">Create as a child of current article</label> -->
<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="checkbox" name="wiki_article_is_child" id="id_wiki_artcile_is_child" disabled="true" ${ 'checked="checked"' if wiki_article is not UNDEFINED else ""}> -->
<input type="submit" class="button" value="Next &gt;" style="display: inline-block; margin-right: 2px; font-weight: bold;" /> </div>
</p>
</form> <ul>
</div>
<p> <li>
<input type="submit" class="button" value="Create" style="display: inline-block; margin-right: 2px; font-weight: bold;" />
%if wiki_article is not UNDEFINED: </li>
<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 /> </ul>
<input type="button" onclick="javascript:location.href='${reverse("wiki_history", args=[wiki_article.get_url(),1])}'" value="History" style="width: 100%;" class="button" /> </form>
%endif </div>
<input type="button" onclick="document.getElementById('wiki_create_form').style.display='block';" value="Create article" style="width: 100%; margin-bottom: 2px;" class="button" /> </li>
<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" /> </ul>
</p>
%if wiki_article is not UNDEFINED: </div>
%if wiki_article.locked: </%block>
<p><strong>This article has been locked</strong></p>
%endif <section class="wiki-body">
<p> <header>
<i>Last modified: ${wiki_article.modified_on.strftime("%b %d, %Y, %I:%M %p")}</i> %if wiki_article is not UNDEFINED:
</p> %if wiki_article.locked:
%endif <p><strong>This article has been locked</strong></p>
</div> %endif
<div class="wiki_box_footer"> <p>Last modified: ${wiki_article.modified_on.strftime("%b %d, %Y, %I:%M %p")}</p>
<div class="wiki_box_corner"></div> %endif
<div class="wiki_box_bar"></div>
</div> %if wiki_article is not UNDEFINED:
</div> <ul>
<li>
</div> <input type="button" onclick="javascript:location.href='${reverse("wiki_view", args=[wiki_article.get_url()])}'" value="View" />
</li>
</%block> <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 ""}/>
<%block name="wiki_body"/> </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> </section>
</%block> </%block>
simplewiki_create.html
...@@ -5,17 +5,15 @@ ...@@ -5,17 +5,15 @@
<%block name="wiki_page_title"> <%block name="wiki_page_title">
Create article Create article
</%block> </%block>
<%block name="wiki_body"> <%block name="wiki_body">
<form method="POST" id="wiki_revision"> <form method="POST" id="wiki_revision">
<div style="display:none"> <div style="display:none">
<input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}"/> <input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}"/>
</div> </div>
<table id="wiki_revision_table">
${ wiki_form } ${ wiki_form }
<tr>
<td colspan="2" align="right"> <input type="submit" value="Create article" /></td>
<input type="submit" value="Create article" /></td>
</tr>
</table>
</form> </form>
</%block> </%block>
simplewiki_edit.html
...@@ -11,12 +11,9 @@ ${ wiki_article.title } ...@@ -11,12 +11,9 @@ ${ wiki_article.title }
<div style="display:none"> <div style="display:none">
<input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}"/> <input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}"/>
</div> </div>
<table id="wiki_revision_table">
${wiki_form} ${wiki_form}
<tr>
<td colspan="2" align="right"> <input type="submit" value="Edit article" /></td>
<input type="submit" value="Edit article" /></td>
</tr>
</table>
</form> </form>
</%block> </%block>
simplewiki_view.html
...@@ -3,11 +3,11 @@ ...@@ -3,11 +3,11 @@
<%inherit file="simplewiki_base.html"/> <%inherit file="simplewiki_base.html"/>
<%block name="wiki_page_title"> <%block name="wiki_page_title">
${ wiki_article.title } ${ wiki_article.title }
</%block> </%block>
<%block name="wiki_body">
<div id="wiki_article"> <%block name="wiki_body">
${ wiki_article.current_revision.contents_parsed| n} <div id="wiki_article">
</div> ${ wiki_article.current_revision.contents_parsed| n}
</div>
</%block> </%block>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment