Skip to content

E
edx-platform
Commit d1760f9a by Tom Giannattasio
Options

styled markdown modal and link

parent d94ef545
Showing with 117 additions and 61 deletions
lms/static/sass/course/wiki/_wiki.scss
......@@ -567,29 +567,79 @@ section.wiki {
background: #f00 !important;
}
.cheatsheet {
float: right;
position: relative;
top: -26px;
font-size: 12px;
}
#cheatsheetLink {
text-align:right;
display: float;
text-align: right;
display: float;
}
#cheatsheetModal {
width: 350px;
margin-left: 100px;
margin-top: -100px;
}
width: 950px;
margin-left: -450px;
margin-top: -100px;
.left-column {
margin-right: 10px;
}
.left-column,
.right-column {
float: left;
width: 450px;
}
.close-btn {
display: block;
position: absolute;
top: -8px;
right: -8px;
width: 30px;
height: 30px;
border-radius: 30px;
border: 1px solid #ccc;
@include linear-gradient(top, #eee, #d2d2d2);
font-size: 22px;
line-height: 28px;
color: #333;
text-align: center;
@include box-shadow(0 1px 0 #fff inset, 0 1px 2px rgba(0, 0, 0, .2));
}
}
#cheatsheet-body {
background: #FFF;
text-align: left;
padding: 10px;
background: #fff;
text-align: left;
padding: 20px;
font-size: 14px;
@include clearfix;
h3 {
font-weight: bold;
}
ul {
list-style: circle;
line-height: 1.4;
color: #333;
}
}
#cheatsheet-body section + section {
margin-top: 40px;
}
#cheatsheet-body pre{
color: #000;
text-align: left;
background: #EEE;
margin:10px;
padding: 10px;
color: #000;
text-align: left;
background: #eee;
padding: 10px;
font-size: 12px;
}
/*-----------------
......
lms/templates/wiki/base.html
......@@ -42,10 +42,13 @@
<script type="text/javascript">
$(document).ready(function () {
editor = $('#div_id_content div.controls');
cs = editor.prepend('<a id="cheatsheetLink" href="#">cheatsheet</a>');
cs = editor.prepend('<p class="cheatsheet">Markdown syntax is allowed. See the <a id="cheatsheetLink" href="#">cheatsheet</a> for help.</p>');
cs.click(function() {
$('#cheatsheetModal').modal('show');
});
$('#cheatsheetModal .close-btn').click(function(e) {
$('#cheatsheetModal').modal('hide');
});
});
</script>
{% endaddtoblock %}
......
lms/templates/wiki/includes/cheatsheet.html
<section id="cheatsheetModal" class="modal hide fade" >
<div id="cheatsheet-body" class="modal-body">
<h2>Wiki Syntax Help</h2>
<p> This wiki uses <strong>Markdown</strong> for styling.
There are several <a href="http://daringfireball.net/projects/markdown/basics" target="_blank">useful</a>
<a href="http://greg.vario.us/doc/markdown.txt" target="_blank">guides</a>
<a href="http://www.lowendtalk.com/discussion/6/miniature-markdown-guide" target="_blank">online</a>.
<p> To create a new wiki article, create a link to it. Clicking the link gives you the creation page.
<pre>
[Article Name](wiki:ArticleName)
</pre>
<h2> Useful examples:</h2>
<pre>
<section id="cheatsheetModal" class="modal hide fade">
<a href="#" class="close-btn">×</a>
<div id="cheatsheet-body" class="modal-body">
<div class="left-column">
<section>
<h2>Wiki Syntax Help</h2>
<p>This wiki uses <strong>Markdown</strong> for styling. There are several useful guides online. See any of the links below for in-depth details:</p>
<ul>
<li><a href="http://daringfireball.net/projects/markdown/basics" target="_blank">Markdown: Basics</a></li>
<li><a href="http://greg.vario.us/doc/markdown.txt" target="_blank">Quick Markdown Syntax Guide</a></li>
<li><a href="http://www.lowendtalk.com/discussion/6/miniature-markdown-guide" target="_blank">Miniature Markdown Guide</a></li>
</ul>
<p>To create a new wiki article, create a link to it. Clicking the link gives you the creation page.</p>
<pre>[Article Name](wiki:ArticleName)</pre>
</section>
<section>
<h3>edX Additions:</h3>
<pre>
circuit-schematic:</pre>
<pre>
$LaTeX Math Expression$</pre>
</section>
</div>
<div class="right-column">
<section>
<h3>Useful examples:</h3>
<pre>
http://wikipedia.org
[Wikipedia](http://wikipedia.org)
[edX Wiki](wiki:/edx/)
</pre>
<pre>
[edX Wiki](wiki:/edx/)</pre>
<pre>
Huge Header
===========
</pre>
<pre>
===========</pre>
<pre>
Smaller Header
--------------
</pre>
<pre>
*emphasis* or _emphasis_
</pre>
<pre>
**strong** or __strong__
</pre>
<pre>
--------------</pre>
<pre>
*emphasis* or _emphasis_</pre>
<pre>
**strong** or __strong__</pre>
<pre>
- Unordered List
- Sub Item 1
- Sub Item 2
</pre>
<pre>
- Sub Item 1
- Sub Item 2</pre>
<pre>
1. Ordered
2. List
</pre>
<pre>
> Quotes
</pre>
<h2>edX Additions:</h2>
<pre>
circuit-schematic:
</pre>
<pre>
$LaTeX Math Expression$
</pre>
</div>
</div>
2. List</pre>
<pre>
> Quotes</pre>
</section>
</div>
</div>
</div>
</section>
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