Skip to content

E
edx-platform
Commit d85e36cd by Piotr Mitros
Options

Merge

parents 81d7be7e 849c5d92
Showing with 1143 additions and 530 deletions
.hgignore
...@@ -4,3 +4,4 @@ syntax: glob ...@@ -4,3 +4,4 @@ syntax: glob
*.scssc *.scssc
*.swp *.swp
*.orig *.orig
*.DS_Store
help.html
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<section class="help main-content"> <section class="help main-content">
<h1>Help</h1> <h1>Help</h1>
<p> If you need help, first try <a href="discussion/questions/">asking a question in the forums</a> and in the IRC channel (irc.mitx.org, channel #6002). As the semester starts, we will add a Frequently Asked Questions section.</p> <p> If you need help, first try <a href="/discussion">asking a question in the forums</a> and in the IRC channel (irc.mitx.org, channel #6002). As the semester starts, we will add a Frequently Asked Questions section.</p>
<p> If you can't solve your problems with self-help, we have several e-mail addresses set up:</p> <p> If you can't solve your problems with self-help, we have several e-mail addresses set up:</p>
......
index.html
<%inherit file="marketing.html" /> <%inherit file="marketing.html" />
<%block name="header"> <%block name="header_text">
<header class="announcement course">
<div class="anouncement-wrapper">
${parent.header_nav()}
<section class="course"> <section class="course">
<section> <section>
<h1>Circuits &amp; Electronics</h1> <h1>Circuits &amp; Electronics</h1>
<h2>6.002</h2> <h2>6.002x</h2>
<a class="enroll" rel="leanModal" href="#enroll">Enroll in 6.002 Circuits <span>&amp;</span> Electronics</a> <a class="enroll" rel="leanModal" href="#enroll">Enroll in 6.002 Circuits <span>&amp;</span> Electronics</a>
</section> </section>
<p> Taught by Anant Agarwal, with Gerald Sussman, Piotr Mitros, and Chris Terman, &ldquo;6.002x Circuits and Electronics&rdquo; is an experimental on-line adaption of MIT's first undergraduate analog design course 6.002. This course will run, free of charge, for students worldwide from February 21, 2012 through June&nbsp;10,&nbsp;2012.</p> <p> Taught by Anant Agarwal, with Gerald Sussman, Piotr Mitros, and Chris Terman, &ldquo;6.002x Circuits and Electronics&rdquo; is an experimental on-line adaption of MIT's first undergraduate analog design course 6.002. This course will run, free of charge, for students worldwide from February 21, 2012 through June&nbsp;10,&nbsp;2012.</p>
</section> </section>
</div>
</header>
</%block> </%block>
<%block name="header_class">course</%block>
<section class="index-content"> <section class="index-content">
<section class="about-course"> <section class="about-course">
<section class="about-info"> <section class="about-info">
<h1>About 6.002</h1> <h1>About 6.002x</h1>
<p>6.002x is designed to serve as a first course in an undergraduate electrical engineering (EE), or electrical engineering and computer science (EECS) curriculum. At MIT, 6.002 is in the core of department subjects required for all undergraduates in EECS.</p> <p>6.002x is designed to serve as a first course in an undergraduate electrical engineering (EE), or electrical engineering and computer science (EECS) curriculum. At MIT, 6.002 is in the core of department subjects required for all undergraduates in EECS.</p>
...@@ -31,7 +26,7 @@ ...@@ -31,7 +26,7 @@
</section> </section>
<section class="on-mitx"> <section class="on-mitx">
<h1>6.002 on <em>MITx</em></h1> <!-- Link doesn't need to be here, but there should be some way to get back to main MITx site --> <h1>6.002x on <em>MITx</em></h1> <!-- Link doesn't need to be here, but there should be some way to get back to main MITx site -->
<p>Students who successfully complete the course will receive an electronic certificate of accomplishment from MIT. Since this is an experimental version of the course, the certificate will be marked as Beta.</p> <p>Students who successfully complete the course will receive an electronic certificate of accomplishment from MIT. Since this is an experimental version of the course, the certificate will be marked as Beta.</p>
......
main.html
...@@ -18,12 +18,9 @@ ...@@ -18,12 +18,9 @@
<script type="text/javascript" src="/static/js/cktsim.js"></script> <script type="text/javascript" src="/static/js/cktsim.js"></script>
<!--[if lt IE 9]> <!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script> <script src="/static/js/html5shiv.js"></script>
<![endif]--> <![endif]-->
<!-- Warning: Do not upgrade FancyBox. V2.0 is under a non-free CC license -->
<script type="text/javascript" src="/static/lib/fancybox/jquery.fancybox-1.3.4.js"></script>
<link rel="stylesheet" href="/static/lib/fancybox/jquery.fancybox-1.3.4.css">
<script type="text/x-mathjax-config"> <script type="text/x-mathjax-config">
MathJax.Hub.Config({ MathJax.Hub.Config({
tex2jax: {inlineMath: [["\\(","\\)"]], tex2jax: {inlineMath: [["\\(","\\)"]],
......
marketing.html
...@@ -9,20 +9,21 @@ ...@@ -9,20 +9,21 @@
<script type="text/javascript" src="/static/lib/jquery-1.6.2.min.js"></script> <script type="text/javascript" src="/static/lib/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="/static/lib/jquery-ui-1.8.16.custom.min.js"></script> <script type="text/javascript" src="/static/lib/jquery-ui-1.8.16.custom.min.js"></script>
<!-- Warning: Do not upgrade FancyBox. V2.0 is under a non-free CC license -->
<script type="text/javascript" src="/static/lib/fancybox/jquery.fancybox-1.3.4.js"></script>
<link rel="stylesheet" href="/static/lib/fancybox/jquery.fancybox-1.3.4.css">
<script type="text/javascript" src="/static/lib/jquery.leanModal.min.js"></script> <script type="text/javascript" src="/static/lib/jquery.leanModal.min.js"></script>
<script type="text/javascript" src="/static/lib//swfobject/swfobject.js"></script> <script type="text/javascript" src="/static/lib//swfobject/swfobject.js"></script>
<script type="text/javascript" src="/static/lib/jquery.treeview.js"></script> <script type="text/javascript" src="/static/lib/jquery.treeview.js"></script>
<script type="text/javascript" src="/static/js/video_player.js"></script> <script type="text/javascript" src="/static/js/video_player.js"></script>
<!-- <script type="text/javascript" src="/static/js/schematic.js"></script> --> <!-- <script type="text/javascript" src="/static/js/schematic.js"></script> -->
<script type="text/javascript"> <!--[if lt IE 9]>
$(function(){ <script src="/static/js/html5shiv.js"></script>
$("a[rel*=leanModal]").leanModal(); <![endif]-->
});
</script> <script type="text/javascript">
$(function(){
$("a[rel*=leanModal]").leanModal();
});
</script>
<%block name="headextra"/> <%block name="headextra"/>
...@@ -30,7 +31,7 @@ ...@@ -30,7 +31,7 @@
<body> <body>
<%block name="header"> <%block name="header">
<header class="announcement"> <header class="announcement <%block name="header_class"/>">
<div class="anouncement-wrapper"> <div class="anouncement-wrapper">
<%block name="header_nav"> <%block name="header_nav">
<nav> <nav>
......
mitx_global.html
<%inherit file="marketing.html" /> <%inherit file="marketing.html" />
<%block name="header_class">home</%block>
<section class="index-content"> <section class="index-content">
<section class="about"> <section class="about">
<h1><em>MITx</em> is MIT&rsquo;s online learning initiative.</h1> <h1><em>MITx</em> is MIT&rsquo;s online learning initiative.</h1>
......
navigation.html
<div class="header-wrapper"> <div class="header-wrapper">
<header> <header>
<h1><em>MITx</em> Circuits and Electronics</h1> <h1><em>MITx</em></h1>
<nav> <nav>
<h2><a href="/courseware">Circuits and Electronics</a></h2>
<ul class="coursenav"> <ul class="coursenav">
<li><a href="/courseware">Courseware</a></li> <li><a href="/courseware">Courseware</a></li>
<li><a href="/info">Info</a></li> <li><a href="/info">Course Info</a></li>
<li><a href="/book">Textbook</a></li> <li><a href="/book">Textbook</a></li>
<li><a href="/discussion">Discussion</a></li> <li><a href="/discussion">Discussion</a></li>
<li><a href="/wiki">Wiki</a></li> <li><a href="/wiki">Wiki</a></li>
......
registration/password_reset_email.html
...@@ -3,12 +3,12 @@ ...@@ -3,12 +3,12 @@
{% trans "Please go to the following page and choose a new password:" %} {% trans "Please go to the following page and choose a new password:" %}
{% block reset_link %} {% block reset_link %}
{{ protocol }}://{{ domain }}{% url 'django.contrib.auth.views.password_reset_confirm' uidb36=uid token=token %} https://6002x.mitx.mit.edu{% url 'django.contrib.auth.views.password_reset_confirm' uidb36=uid token=token %}
{% endblock %} {% endblock %}
{% trans "Your username, in case you've forgotten:" %} {{ user.username }} {% trans "Your username, in case you've forgotten:" %} {{ user.username }}
{% trans "Thanks for using our site!" %} {% trans "Thanks for using our site!" %}
{% blocktrans %}The {{ site_name }} team{% endblocktrans %} {% blocktrans %}The MITx team{% endblocktrans %}
{% endautoescape %} {% endautoescape %}
sass/_askbot-original.scss
...@@ -662,116 +662,116 @@ ul#searchTags { ...@@ -662,116 +662,116 @@ ul#searchTags {
float: right; float: right;
padding-top: 2px; } padding-top: 2px; }
.search-tips { // .search-tips {
font-size: 16px; // font-size: 16px;
line-height: 17px; // line-height: 17px;
color: #707070; // color: #707070;
margin: 5px 0 10px 0; // margin: 5px 0 10px 0;
padding: 0px; // padding: 0px;
float: left; // float: left;
font-family: 'Yanone Kaffeesatz',sans-serif; // font-family: 'Yanone Kaffeesatz',sans-serif;
a { // a {
text-decoration: underline; // text-decoration: underline;
color: #1b79bd; } } // color: #1b79bd; } }
#question-list {
float: left;
position: relative;
background-color: #FFF;
padding: 0;
width: 100%; }
.short-summary { // #question-list {
position: relative; // float: left;
filter: inherit; // position: relative;
padding: 10px; // background-color: #FFF;
border-bottom: 1px solid #DDDBCE; // padding: 0;
margin-bottom: 1px; // width: 100%; }
overflow: hidden;
width: 710px; // .short-summary {
float: left; // position: relative;
background: url(../images/summary-background.png) repeat-x; // filter: inherit;
h2 { // padding: 10px;
font-size: 24px; // border-bottom: 1px solid #DDDBCE;
font-weight: normal; // margin-bottom: 1px;
line-height: 26px; // overflow: hidden;
padding-left: 0; // width: 710px;
margin-bottom: 6px; // float: left;
display: block; // background: url(../images/summary-background.png) repeat-x;
font-family: 'Yanone Kaffeesatz',sans-serif; } // h2 {
a { // font-size: 24px;
color: #464646; } // font-weight: normal;
.userinfo { // line-height: 26px;
text-align: right; // padding-left: 0;
line-height: 16px; // margin-bottom: 6px;
font-family: Arial; // display: block;
padding-right: 4px; // font-family: 'Yanone Kaffeesatz',sans-serif; }
.relativetime { // a {
font-size: 11px; // color: #464646; }
clear: both; // .userinfo {
font-weight: normal; // text-align: right;
color: #555; } } // line-height: 16px;
span.anonymous { // font-family: Arial;
font-size: 11px; // padding-right: 4px;
clear: both; // .relativetime {
font-weight: normal; // font-size: 11px;
color: #555; } // clear: both;
.userinfo a { // font-weight: normal;
font-weight: bold; // color: #555; } }
font-size: 11px; } // span.anonymous {
.counts { // font-size: 11px;
float: right; // clear: both;
margin: 4px 0 0 5px; // font-weight: normal;
font-family: 'Yanone Kaffeesatz',sans-serif; // color: #555; }
.item-count { // .userinfo a {
padding: 0px 5px 0px 5px; // font-weight: bold;
font-size: 25px; // font-size: 11px; }
font-family: 'Yanone Kaffeesatz',sans-serif; } // .counts {
.votes div, .views div, .answers div, .favorites div { // float: right;
margin-top: 3px; // margin: 4px 0 0 5px;
font-size: 14px; // font-family: 'Yanone Kaffeesatz',sans-serif;
line-height: 14px; // .item-count {
color: #646464; } } // padding: 0px 5px 0px 5px;
.tags { // font-size: 25px;
margin-top: 0; } // font-family: 'Yanone Kaffeesatz',sans-serif; }
.votes, .answers, .favorites, .views { // .votes div, .views div, .answers div, .favorites div {
text-align: center; // margin-top: 3px;
margin: 0 3px; // font-size: 14px;
padding: 8px 2px 0px 2px; // line-height: 14px;
width: 51px; // color: #646464; } }
float: right; // .tags {
height: 44px; // margin-top: 0; }
border: #dbdbd4 1px solid; } // .votes, .answers, .favorites, .views {
.votes { // text-align: center;
background: url(../images/vote-background.png) repeat-x; } // margin: 0 3px;
.answers { // padding: 8px 2px 0px 2px;
background: url(../images/answers-background.png) repeat-x; } // width: 51px;
.views { // float: right;
background: url(../images/view-background.png) repeat-x; } // height: 44px;
.no-votes .item-count { // border: #dbdbd4 1px solid; }
color: #b1b5b6; } // .votes {
.some-votes .item-count { // background: url(../images/vote-background.png) repeat-x; }
color: #4a757f; } // .answers {
.no-answers .item-count { // background: url(../images/answers-background.png) repeat-x; }
color: #b1b5b6; } // .views {
.some-answers .item-count { // background: url(../images/view-background.png) repeat-x; }
color: #eab243; } // .no-votes .item-count {
.no-views .item-count { // color: #b1b5b6; }
color: #b1b5b6; } // .some-votes .item-count {
.some-views .item-count { // color: #4a757f; }
color: #d33f00; } // .no-answers .item-count {
.accepted .item-count { // color: #b1b5b6; }
background: url(../images/accept.png) no-repeat top right; // .some-answers .item-count {
display: block; // color: #eab243; }
text-align: center; // .no-views .item-count {
width: 40px; // color: #b1b5b6; }
color: #eab243; } // .some-views .item-count {
.some-favorites .item-count { // color: #d33f00; }
background: #338333; // .accepted .item-count {
color: #d0f5a9; } // background: url(../images/accept.png) no-repeat top right;
.no-favorites .item-count { // display: block;
background: #eab243; // text-align: center;
color: yellow; } } // width: 40px;
// color: #eab243; }
// .some-favorites .item-count {
// background: #338333;
// color: #d0f5a9; }
// .no-favorites .item-count {
// background: #eab243;
// color: yellow; } }
// .evenMore { // .evenMore {
// font-size: 13px; // font-size: 13px;
...@@ -869,31 +869,31 @@ ul#searchTags { ...@@ -869,31 +869,31 @@ ul#searchTags {
.tag-size-10 { .tag-size-10 {
font-size: 21px; } font-size: 21px; }
ul { // ul {
&.tags { // &.tags {
list-style: none; // list-style: none;
margin: 0; // margin: 0;
padding: 0; // padding: 0;
line-height: 170%; // line-height: 170%;
display: block; // display: block;
&.marked-tags { // &.marked-tags {
list-style: none; // list-style: none;
margin: 0; // margin: 0;
padding: 0; // padding: 0;
line-height: 170%; // line-height: 170%;
display: block; } } // display: block; } }
&#related-tags { // &#related-tags {
list-style: none; // list-style: none;
margin: 0; // margin: 0;
padding: 0; // padding: 0;
line-height: 170%; // line-height: 170%;
display: block; } // display: block; }
&.tags li { // &.tags li {
float: left; // float: left;
display: block; // display: block;
margin: 0 8px 0 0; // margin: 0 8px 0 0;
padding: 0; // padding: 0;
height: 20px; } } // height: 20px; } }
.wildcard-tags { .wildcard-tags {
clear: both; } clear: both; }
...@@ -919,35 +919,35 @@ ul { ...@@ -919,35 +919,35 @@ ul {
float: left; float: left;
clear: left; } } clear: left; } }
.tag-left { // .tag-left {
cursor: pointer; // cursor: pointer;
display: block; // display: block;
float: left; // float: left;
height: 17px; // height: 17px;
margin: 0 5px 0 0; // margin: 0 5px 0 0;
padding: 0; // padding: 0;
-webkit-box-shadow: 0px 0px 5px #d3d6d7; // -webkit-box-shadow: 0px 0px 5px #d3d6d7;
-moz-box-shadow: 0px 0px 5px #d3d6d7; // -moz-box-shadow: 0px 0px 5px #d3d6d7;
box-shadow: 0px 0px 5px #d3d6d7; } // box-shadow: 0px 0px 5px #d3d6d7; }
.tag-right { // .tag-right {
background: #f3f6f6; // background: #f3f6f6;
border: #fff 1px solid; // border: #fff 1px solid;
border-top: #fff 2px solid; // border-top: #fff 2px solid;
outline: #cfdbdb 1px solid; // outline: #cfdbdb 1px solid;
display: block; // display: block;
float: left; // float: left;
height: 17px; // height: 17px;
line-height: 17px; // line-height: 17px;
font-weight: normal; // font-weight: normal;
font-size: 11px; // font-size: 11px;
padding: 0px 8px 0px 8px; // padding: 0px 8px 0px 8px;
text-decoration: none; // text-decoration: none;
text-align: center; // text-align: center;
white-space: nowrap; // white-space: nowrap;
vertical-align: middle; // vertical-align: middle;
font-family: Arial; // font-family: Arial;
color: #717179; } // color: #717179; }
.deletable-tag { .deletable-tag {
margin-right: 3px; margin-right: 3px;
...@@ -2563,13 +2563,13 @@ p.signup_p { ...@@ -2563,13 +2563,13 @@ p.signup_p {
margin-bottom: 7px; margin-bottom: 7px;
font-size: 14px; } } font-size: 14px; } }
.search-result-summary { // .search-result-summary {
font-weight: bold; // font-weight: bold;
font-size: 18px; // font-size: 18px;
line-height: 22px; // line-height: 22px;
margin: 0px 0px 0px 0px; // margin: 0px 0px 0px 0px;
padding: 2px 0 0 0; // padding: 2px 0 0 0;
float: left; } // float: left; }
.faq-rep-item { .faq-rep-item {
text-align: right; text-align: right;
......
sass/_base-extends.scss
...@@ -109,11 +109,18 @@ ...@@ -109,11 +109,18 @@
@extend .clearfix; @extend .clearfix;
a { a {
text-transform: uppercase; @include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
background: darken(#F6EFD4, 5%);
border-left: 1px solid darken(#f6efd4, 20%);
color: darken(#F6EFD4, 80%); color: darken(#F6EFD4, 80%);
padding: lh(.75);
text-transform: uppercase;
display: block;
&:hover { &:hover {
color: darken(#F6EFD4, 60%); color: darken(#F6EFD4, 60%);
text-decoration: none;
background: none;
} }
} }
} }
sass/_base-variables.scss
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
// ---------------------------------------- // // ---------------------------------------- //
// fonts // fonts
$body-font-family: "Droid Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;; $body-font-family: "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;;
$body-font-size: 14px; $body-font-size: 14px;
// grid // grid
......
sass/_base.scss
:focus {
outline-color: #ccc;
}
h1 { h1 {
font-size:1.6em; font-size:1.6em;
margin:20px 0 10px 0; margin:20px 0 10px 0;
...@@ -17,7 +21,6 @@ p { ...@@ -17,7 +21,6 @@ p {
em { em {
font-style: italic; font-style: italic;
font-family: Georgia, serif;
} }
#{$all-text-inputs}, textarea { #{$all-text-inputs}, textarea {
......
sass/_courseware-video.scss 0 → 100644
section.course-content {
div.video-wrapper {
float: left;
width: flex-grid(6, 9);
margin-right: flex-gutter(9);
div.video-player {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
object {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
iframe#html5_player {
border: none;
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
}
section {
ul {
display: inline-block;
li {
margin-top: 5px;
display: inline-block;
cursor: pointer;
border: 0;
padding: 0;
div {
&:empty {
display: none;
}
}
}
}
div#slider {
margin: -14px 0 10px 60px;
}
div#vidtime {
float: left;
}
div#video_speeds {
float: right;
cursor: pointer;
span {
&:hover {
color: $mit-red;
}
}
}
}
}
ol.subtitles {
float: left;
width: flex-grid(3, 9);
li {
margin-bottom: 0px;
cursor: pointer;
border: 0;
padding: 0;
color: #666;
&.current {
background-color: #f3f3f3;
color: #333;
}
&:hover {
color: $mit-red;
}
div {
margin-bottom: 8px;
}
div:empty {
margin-bottom: 0px;
}
}
}
}
sass/_courseware.scss
div.course-wrapper { div.course-wrapper {
@extend .table-wrapper; @extend .table-wrapper;
ul, ol {
list-style: none;
}
div#accordion { div#accordion {
@extend .sidebar; @extend .sidebar;
div#open_close_accordion { div#open_close_accordion {
position: absolute; position: absolute;
right: 0px; right: 0px;
width: 20px; width: 20px;
height: 20px; height: 20px;
background: #ccc; background: #ccc;
border: 1px solid black; border: 1px solid black;
right: -22px; right: -22px;
top: 5px; top: 5px;
} }
h3 { h3 {
overflow: hidden; overflow: hidden;
...@@ -59,7 +63,7 @@ div.course-wrapper { ...@@ -59,7 +63,7 @@ div.course-wrapper {
a { a {
text-decoration: none; text-decoration: none;
margin-bottom: $body-line-height; margin-bottom: lh(.5);
display: block; display: block;
&:hover { &:hover {
...@@ -82,12 +86,15 @@ div.course-wrapper { ...@@ -82,12 +86,15 @@ div.course-wrapper {
@extend .content; @extend .content;
ol.vert-mod { ol.vert-mod {
li { > li {
@extend .clearfix; @extend .clearfix;
border-top: 1px solid #eee;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
padding: 15px 0; padding: 15px 0;
&:last-child {
border-bottom: none;
}
h2 { h2 {
margin-top: 0; margin-top: 0;
margin-bottom: 15px; margin-bottom: 15px;
...@@ -102,97 +109,119 @@ div.course-wrapper { ...@@ -102,97 +109,119 @@ div.course-wrapper {
ol.sequence-nav { ol.sequence-nav {
margin-bottom: $body-line-height; margin-bottom: $body-line-height;
@extend .topbar;
li { li {
border: none; border: none;
cursor: pointer; cursor: pointer;
display: table-cell; display: table-cell;
min-width: 30px; padding: lh(.75);
min-height: 30px; float: left;
padding: 0 10px;
}
}
div.video-wrapper {
float: left;
width: 640px;
min-height: 620px;
iframe#html5_player { //problem
border: none; &.seq_problem_inactive {
display: none; width: 14px;
height: 390px; background: url('/static/images/problem-icon.png') 13px 13px no-repeat;
width: 640px; @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 10%));
}
section { &:hover {
ul { background-color: lighten(#F6EFD4, 3%);
display: inline-block; }
}
li { &.seq_problem_visited {
margin-top: 5px; width: 14px;
display: inline-block; background: shade(#F6EFD4, 4%) url('/static/images/problem-icon.png') -57px 13px no-repeat;
cursor: pointer; &:hover {
border: 0; background-color: #F6EFD4;
padding: 0;
div {
&:empty {
display: none;
}
}
} }
} }
div#slider { &.seq_problem_active {
margin: -14px 0 10px 60px; width: 14px;
background: #FFFBEB url('/static/images/problem-icon.png') -22px 13px no-repeat;
@include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%), inset 1px 0 0 darken(#F6EFD4, 20%));
&:hover {
background-color: #F6EFD4;
}
} }
div#vidtime { //video
float: left; &.seq_video_inactive {
width: 14px;
background: url('/static/images/video-icon.png') 13px 15px no-repeat;
@include box-shadow(inset -1px 0 0 darken(#F6EFD4, 10%));
&:hover {
background-color: lighten(#F6EFD4, 3%);
}
} }
div#video_speeds { &.seq_video_visited {
float: right; width: 14px;
cursor: pointer; background: shade(#F6EFD4, 4%) url('/static/images/video-icon.png') -81px 15px no-repeat;
&:hover {
background-color: #F6EFD4;
}
}
span { &.seq_video_active {
&:hover { width: 14px;
color: $mit-red; background: #FFFBEB url('/static/images/video-icon.png') -32px 15px no-repeat;
} @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%),inset 1px 0 0 darken(#F6EFD4, 20%));
&:hover {
background-color: #F6EFD4;
} }
} }
}
}
ol.subtitles {
width: 220px;
margin-left: 20px;
float: left;
li { //vertical
margin-bottom: 0px; &.seq_vertical_inactive {
cursor: pointer; width: 14px;
border: 0; background: url('/static/images/vertical-icon.png') -82px 15px no-repeat;
padding: 0; @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 10%));
color: #666;
&.current { &:hover {
background-color: #f3f3f3; background-color: lighten(#F6EFD4, 3%);
color: #333; }
} }
&:hover { &.seq_vertical_visited {
color: $mit-red; width: 14px;
background: shade(#F6EFD4, 4%) url('/static/images/vertical-icon.png') 13px 15px no-repeat;
&:hover {
background-color: #F6EFD4;
}
}
&.seq_vertical_active {
width: 14px;
background: #FFFBEB url('/static/images/vertical-icon.png') -35px 15px no-repeat;
@include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%), inset 1px 0 0 darken(#F6EFD4, 20%));
&:hover {
background-color: #F6EFD4;
}
} }
div {
margin-bottom: 8px;
}
div:empty { &.prev, &.next {
margin-bottom: 0px; @include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
} background: darken(#F6EFD4, 5%);
border-left: 1px solid darken(#f6efd4, 20%);
color: darken(#F6EFD4, 80%);
float: right;
letter-spacing: 1px;
padding: lh(.75);
text-transform: uppercase;
&:hover {
text-decoration: none;
color: darken(#F6EFD4, 60%);
text-decoration: none;
background: none;
}
}
} }
} }
} }
......
sass/_discussion-questions.scss
div.question-controls {
display: block;
margin-bottom: 30px;
overflow: hidden;
width: flex-grid(9,9);
div {
display: inline-block;
}
div.question-count {
margin-right: flex-gutter();
width: flex-grid(5.5,9);
h1 {
margin-top: 0;
}
}
div.question-sort {
vertical-align: bottom;
width: flex-grid(3.5,9);
nav {
@include border-radius(35px);
background-color: lighten(#F6EFD4, 5%) ;
height: 30px;
float: right;
font-size: 16px;
margin: 3px 0;
padding: 0 20px;
a {
color: darken(#F6EFD4, 50%);
&:before {
content: '|';
color: darken(#F6EFD4, 10%);
font-size: 22px;
}
&:hover {
text-decoration: none;
color: darken(#F6EFD4, 70%);
}
}
}
}
}
ul.question-list {
width: flex-grid(9,9);
li.single-question {
border-top: 1px solid #eee;
list-style: none;
padding: 10px 0;
&:hover {
background: lighten(#F6EFD4, 8%);
}
div {
display: inline-block;
&.question-body {
@include box-sizing(border-box);
margin-right: flex-gutter();
padding-left: 10px;
width: flex-grid(5.5,9);
h2 {
font-size: 16px;
font-weight: normal;
margin: 0px 0 15px 0;
text-transform: none;
a {
color: #000;
}
}
div.user-info {
display: inline-block;
vertical-align: top;
span.relative-time {
font-weight: normal;
}
a {
color: $mit-red;
}
}
ul.tags {
display: inline-block;
}
}
&.question-meta {
width: flex-grid(3.5,9);
ul {
text-align: right;
li {
@include border-radius(3px);
display: inline-block;
height:60px;
margin-right: 10px;
width: 60px;
&.views {
background: lighten(#F6EFD4, 5%);
}
&.answers {
background: #F6EFD4;
}
&.votes {
background: darken(#F6EFD4, 5%);
}
span, div {
@include box-sizing(border-box);
color: darken(#F6EFD4, 60%);
display: block;
text-align: center;
}
span {
font-size: 16px;
font-weight: bold;
height: 35px;
padding-top: 15px;
vertical-align: middle;
}
div {
height: 25px;
font-size: 12px;
}
}
}
}
}
}
}
div.search-tips {
display: block;
}
.search-result-summary {
}
sass/_discussion-tags.scss 0 → 100644
ul.tags {
list-style: none;
li, a {
position: relative;
}
li {
@include border-radius(4px);
background: #eee;
color: #555;
display: inline;
font-size: 12px;
margin-left: 15px;
padding: 5px 10px 5px 5px;
&:before {
content:"";
position:absolute;
top:0;
left:-12px;
width:0;
height:0;
border-color:transparent #eee transparent transparent;
border-style:solid;
border-width:12px 12px 12px 0;
}
}
}
sass/_discussion.scss
...@@ -75,31 +75,6 @@ body.askbot { ...@@ -75,31 +75,6 @@ body.askbot {
vertical-align: top; vertical-align: top;
width: flex-grid(9); width: flex-grid(9);
div.order-sort {
@include border-radius(35px);
background-color: lighten(#F6EFD4, 5%) ;
height: 30px;
float: right;
font-size: 16px;
margin: 3px 0;
padding: 0 20px;
a {
color: darken(#F6EFD4, 50%);
&:before {
content: '|';
color: darken(#F6EFD4, 10%);
font-size: 22px;
}
&:hover {
text-decoration: none;
color: darken(#F6EFD4, 70%);
}
}
}
p.tabula-rasa { p.tabula-rasa {
@include border-radius(5px); @include border-radius(5px);
background-color: #f6f6f6; background-color: #f6f6f6;
......
sass/_font-face.scss
/* Generated by Font Squirrel (http://www.fontsquirrel.com) on January 25, 2012 05:06:34 PM America/New_York */
// Not used in UI
// @font-face {
// font-family: 'Open Sans';
// src: url('/static/fonts/OpenSans-Light-webfont.eot');
// src: url('/static/fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
// url('/static/fonts/OpenSans-Light-webfont.woff') format('woff'),
// url('/static/fonts/OpenSans-Light-webfont.ttf') format('truetype'),
// url('/static/fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
// font-weight: 300;
// font-style: normal;
// }
// @font-face {
// font-family: 'Open Sans';
// src: url('/static/fonts/OpenSans-LightItalic-webfont.eot');
// src: url('/static/fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
// url('/static/fonts/OpenSans-LightItalic-webfont.woff') format('woff'),
// url('/static/fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'),
// url('/static/fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg');
// font-weight: 300;
// font-style: italic;
// }
@font-face { @font-face {
font-family: 'Droid Sans'; font-family: 'Open Sans';
font-style: normal; src: url('/static/fonts/OpenSans-Regular-webfont.eot');
font-weight: normal; src: url('/static/fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
src: local('Droid Sans'), local('DroidSans'), url('http://themes.googleusercontent.com/static/fonts/droidsans/v3/s-BiyweUPV0v-yRb-cjciL3hpw3pgy2gAi-Ip7WPMi0.woff') format('woff'); url('/static/fonts/OpenSans-Regular-webfont.woff') format('woff'),
url('/static/fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
url('/static/fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
font-weight: 600;
font-style: normal;
} }
@font-face { @font-face {
font-family: 'Droid Sans'; font-family: 'Open Sans';
font-style: normal; src: url('/static/fonts/OpenSans-Italic-webfont.eot');
font-weight: bold; src: url('/static/fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
src: local('Droid Sans Bold'), local('DroidSans-Bold'), url('http://themes.googleusercontent.com/static/fonts/droidsans/v3/EFpQQyG9GqCrobXxL-KRMXbFhgvWbfSbdVg11QabG8w.woff') format('woff'); url('/static/fonts/OpenSans-Italic-webfont.woff') format('woff'),
url('/static/fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
url('/static/fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
font-weight: 400;
font-style: italic;
} }
// Not used in UI
// @font-face {
// font-family: 'Open Sans';
// src: url('/static/fonts/OpenSans-Semibold-webfont.eot');
// src: url('/static/fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
// url('/static/fonts/OpenSans-Semibold-webfont.woff') format('woff'),
// url('/static/fonts/OpenSans-Semibold-webfont.ttf') format('truetype'),
// url('/static/fonts/OpenSans-Semibold-webfont.svg#OpenSansSemibold') format('svg');
// font-weight: 600;
// font-style: normal;
// }
// @font-face {
// font-family: 'Open Sans';
// src: url('/static/fonts/OpenSans-SemiboldItalic-webfont.eot');
// src: url('/static/fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
// url('/static/fonts/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
// url('/static/fonts/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
// url('/static/fonts/OpenSans-SemiboldItalic-webfont.svg#OpenSansSemiboldItalic') format('svg');
// font-weight: 600;
// font-style: italic;
// }
@font-face {
font-family: 'Open Sans';
src: url('/static/fonts/OpenSans-Bold-webfont.eot');
src: url('/static/fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
url('/static/fonts/OpenSans-Bold-webfont.woff') format('woff'),
url('/static/fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
url('/static/fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/static/fonts/OpenSans-BoldItalic-webfont.eot');
src: url('/static/fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('/static/fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
url('/static/fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
url('/static/fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
font-weight: 700;
font-style: italic;
}
@font-face {
font-family: 'Open Sans';
src: url('/static/fonts/OpenSans-ExtraBold-webfont.eot');
src: url('/static/fonts/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
url('/static/fonts/OpenSans-ExtraBold-webfont.woff') format('woff'),
url('/static/fonts/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
url('/static/fonts/OpenSans-ExtraBold-webfont.svg#OpenSansExtrabold') format('svg');
font-weight: 800;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('/static/fonts/OpenSans-ExtraBoldItalic-webfont.eot');
src: url('/static/fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('/static/fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
url('/static/fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
url('/static/fonts/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansExtraboldItalic') format('svg');
font-weight: 800;
font-style: italic;
}
sass/_index-extends.scss 0 → 100644
.wrapper {
@include box-sizing(border-box);
margin: 0 auto;
max-width: $fg-max-width;
min-width: $fg-min-width;
padding: lh();
width: flex-grid(12);
}
.subpage {
@extend .clearfix;
@extend .wrapper;
> div {
padding-left: flex-grid(4) + flex-gutter();
p {
margin-bottom: lh();
}
h1 {
margin-bottom: lh(.5);
}
h2 {
font: 18px $header-font-family;
color: #000;
margin-bottom: lh(.5);
}
ul {
list-style: disc outside none;
li {
list-style: disc outside none;
}
}
}
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.button {
@include border-radius(3px);
@include border-radius(3px);
@include inline-block();
@include transition();
background-color: $mit-red;
color: #fff;
margin: lh() 0 lh(.5);
padding: lh(.25) lh(.5);
text-decoration: none;
font-style: normal;
-webkit-font-smoothing: antialiased;
&:hover {
background-color: darken($mit-red, 10%);
}
span {
font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
font-style: italic;
}
}
sass/_index-variables.scss
...@@ -25,5 +25,5 @@ $header-font-family: "Open Sans", Helvetica, Arial, sans-serif; ...@@ -25,5 +25,5 @@ $header-font-family: "Open Sans", Helvetica, Arial, sans-serif;
$lh: golden-ratio($body-font-size, 1); $lh: golden-ratio($body-font-size, 1);
// Colors // Colors
$mit-red: #990000; $mit-red: #933;
$cream: #F6EFD4; $cream: #F6EFD4;
sass/_index.scss
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans'), local('OpenSans'), url('http://themes.googleusercontent.com/static/fonts/opensans/v6/cJZKeOuBrn4kERxqtaUH3bO3LdcAZYWl9Si6vvxL-qU.woff') format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
src: local('Open Sans Italic'), local('OpenSans-Italic'), url('http://themes.googleusercontent.com/static/fonts/opensans/v6/xjAJXh38I15wypJXxuGMBrrIa-7acMAeDBVuclsi6Gc.woff') format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
src: local('Open Sans Extrabold'), local('OpenSans-Extrabold'), url('http://themes.googleusercontent.com/static/fonts/opensans/v6/EInbV5DfGHOiMmvb1Xr-hqRDOzjiPcYnFooOUGCOsRk.woff') format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 800;
src: local('Open Sans Extrabold Italic'), local('OpenSans-ExtraboldItalic'), url('http://themes.googleusercontent.com/static/fonts/opensans/v6/PRmiXeptR36kaC0GEAetxsBo4hlZyBvkZICS3KpNonM.woff') format('woff');
}
// Extends
//---------------------------------------- //
.wrapper {
@include box-sizing(border-box);
margin: 0 auto;
max-width: $fg-max-width;
min-width: $fg-min-width;
padding: lh();
width: flex-grid(12);
}
.subpage {
@extend .clearfix;
@extend .wrapper;
> div {
padding-left: flex-grid(4) + flex-gutter();
p {
margin-bottom: lh();
}
h1 {
margin-bottom: lh(.5);
}
h2 {
font: 18px $header-font-family;
color: #000;
margin-bottom: lh(.5);
}
ul {
list-style: disc outside none;
li {
list-style: disc outside none;
}
}
}
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.button {
@include border-radius(3px);
@include border-radius(3px);
@include inline-block();
@include transition();
background-color: $mit-red;
color: #fff;
margin: lh() 0 lh(.5);
padding: lh(.25) lh(.5);
text-decoration: none;
font-style: normal;
-webkit-font-smoothing: antialiased;
&:hover {
background-color: darken($mit-red, 10%);
}
span {
font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
font-style: italic;
}
}
body { body {
background-color: #fff; background-color: #fff;
color: #444; color: #444;
font: $body-font-size $body-font-family; font: $body-font-size $body-font-family;
:focus {
outline-color: #ccc;
}
h1 { h1 {
font: 800 24px $header-font-family; font: 800 24px $header-font-family;
} }
...@@ -140,17 +44,17 @@ body { ...@@ -140,17 +44,17 @@ body {
} }
header.announcement { header.announcement {
// @include background-size(cover); @include background-size(cover);
background: #333; background: #333;
border-bottom: 1px solid #000; border-bottom: 1px solid #000;
color: #fff; color: #fff;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
&.home { &.home {
background: #e3e3e3 url("/static/images/marketing/shot-1-medium.jpg"); background: #e3e3e3 url("/static/images/marketing/shot-5-medium.jpg");
@media screen and (min-width: 1200px) { @media screen and (min-width: 1200px) {
background: #e3e3e3 url("/static/images/marketing/shot-1-large.jpg"); background: #e3e3e3 url("/static/images/marketing/shot-5-large.jpg");
} }
// @media screen and (max-width: 1199px) { // @media screen and (max-width: 1199px) {
...@@ -158,6 +62,17 @@ header.announcement { ...@@ -158,6 +62,17 @@ header.announcement {
div { div {
padding: lh(10) lh() lh(3); padding: lh(10) lh() lh(3);
//hide login link for homepage
nav {
h1 {
margin-right: 0;
}
a.login {
display: none;
}
}
} }
} }
...@@ -188,16 +103,20 @@ header.announcement { ...@@ -188,16 +103,20 @@ header.announcement {
@include border-radius(0 0 3px 3px); @include border-radius(0 0 3px 3px);
background: #333; background: #333;
background: rgba(#000, .7); background: rgba(#000, .7);
padding: lh(.5); padding: lh(.5) lh();
h1 { h1 {
@include inline-block(); @include inline-block();
margin-right: lh(); margin-right: lh(.5);
a { a {
font: italic 800 18px $header-font-family; font: italic 800 18px $header-font-family;
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
&:hover, &:focus {
color: #999;
}
} }
} }
...@@ -206,9 +125,10 @@ header.announcement { ...@@ -206,9 +125,10 @@ header.announcement {
color: #fff; color: #fff;
font-size: 12px; font-size: 12px;
font-style: normal; font-style: normal;
font-family: $header-font-family;
&:hover { &:hover, &:focus {
color: rgba(#fff, .6); color: #999;
} }
} }
} }
......
sass/_layout.scss
...@@ -9,8 +9,9 @@ html { ...@@ -9,8 +9,9 @@ html {
background: #f3f3f3; background: #f3f3f3;
div.header-wrapper { div.header-wrapper {
// @include linear-gradient(lighten($mit-red, 5%), darken($mit-red, 5%));
@include box-shadow(inset 0 1px 0 lighten($mit-red, 10%), 0 1px 1px #ccc); @include box-shadow(inset 0 1px 0 lighten($mit-red, 10%), 0 1px 1px #ccc);
@include linear-gradient(lighten($mit-red, 5%), darken($mit-red, 5%)); background: $mit-red;
border-bottom: 1px solid darken($mit-red, 10%); border-bottom: 1px solid darken($mit-red, 10%);
header { header {
...@@ -21,37 +22,52 @@ html { ...@@ -21,37 +22,52 @@ html {
h1 { h1 {
border-right: 1px solid darken($mit-red, 5%); border-right: 1px solid darken($mit-red, 5%);
font-size: $body-font-size; color: #000;
font-weight: bold;
margin: 0 $gw-gutter 0 0;
padding: 15px $gw-gutter 15px 0;
display: block; display: block;
float: left; float: left;
color: #000; font-size: 20px;
font-weight: 800;
margin: 0 lh() 0 0;
padding: 17px lh() 17px 0;
text-shadow: 0 1px 0 lighten($mit-red, 10%); text-shadow: 0 1px 0 lighten($mit-red, 10%);
line-height: lh();
em {
@include inline-block();
padding-right: lh();
}
} }
nav { nav {
float: left; float: left;
display: block; display: block;
margin: 0; margin: 0;
padding: 0;
text-shadow: 0 -1px 0 darken($mit-red, 10%); text-shadow: 0 -1px 0 darken($mit-red, 10%);
-webkit-font-smoothing: antialiased;
h2 {
float: left;
margin: 0;
padding: 19px 15px 12px 0;
line-height: lh();
a {
color: #fff;
&:hover {
color: rgba(#fff, .7);
text-decoration: none;
}
}
}
ul { ul {
@extend .clearfix; @extend .clearfix;
display: inline-block; display: inline-block;
padding: 15px 0; padding: 19px 0 12px;
margin: 0; margin: 0;
li { li {
margin-right: lh(); margin-right: lh();
display: inline-block; display: inline-block;
margin-bottom: 0; margin-bottom: 0;
line-height: lh();
a { a {
color: #fff; color: #fff;
......
sass/_local.scss
...@@ -16,7 +16,6 @@ ...@@ -16,7 +16,6 @@
.seq_problem_visited { background-color: #ccccaa;} .seq_problem_visited { background-color: #ccccaa;}
.seq_video_visited { background-color: #ccaacc;} .seq_video_visited { background-color: #ccaacc;}
.seq_video_visited { background-color: #cccaac;}
.seq_html_visited { background-color: #caaccc;} .seq_html_visited { background-color: #caaccc;}
.seq_tab_visited { background-color: #aacccc;} .seq_tab_visited { background-color: #aacccc;}
.seq_vertical_visited { background-color: #acaccc;} .seq_vertical_visited { background-color: #acaccc;}
......
sass/_profile.scss
div.profile-wrapper { div.profile-wrapper {
display: table; @extend .table-wrapper;
section.user-info { section.user-info {
@include box-sizing(border-box); @include box-sizing(border-box);
......
sass/_textbook.scss
...@@ -4,13 +4,38 @@ div.book-wrapper { ...@@ -4,13 +4,38 @@ div.book-wrapper {
ul#booknav { ul#booknav {
@extend .sidebar; @extend .sidebar;
@include box-sizing(border-box); @include box-sizing(border-box);
padding: lh();
a {
color: #000;
&:hover {
color: #666;
}
}
li { li {
background: none;
padding-left: 30px;
div.hitarea {
margin-left: -22px;
&:hover {
opacity: 0.6;
filter: alpha(opacity=60);
}
}
ul { ul {
background: none; background: none;
} }
} }
> li {
border-bottom: 1px solid #d3d3d3;
@include box-shadow(0 1px 0 #eee);
padding: 7px 7px 7px 30px;
}
} }
section.book { section.book {
...@@ -18,17 +43,25 @@ div.book-wrapper { ...@@ -18,17 +43,25 @@ div.book-wrapper {
nav { nav {
@extend .topbar; @extend .topbar;
@extend .clearfix;
ul { ul {
@extend .clearfix; @extend .clearfix;
li {
padding: 15px;
li {
&.last { &.last {
float: left; float: left;
display: block;
a {
@include box-shadow(inset -1px 0 0 lighten(#f6efd4, 5%));
border-right: 1px solid darken(#f6efd4, 20%);
border-left: 0;
}
} }
&.next { &.next {
display: block;
float: right; float: right;
} }
} }
......
sass/_wiki-basic-html.scss 0 → 100644
section.wiki-body {
div#wiki_article {
html, address,
blockquote,
body, dd, div,
dl, dt, fieldset, form,
frame, frameset,
h1, h2, h3, h4,
h5, h6, noframes,
ol, p, ul, center,
dir, hr, menu, pre {
display: block;
unicode-bidi: embed
}
li {
display: list-item
}
head {
display: none
}
table {
display: table
}
tr {
display: table-row
}
thead {
display: table-header-group
}
tbody {
display: table-row-group
}
tfoot {
display: table-footer-group
}
col { display: table-column }
colgroup { display: table-column-group }
td, th { display: table-cell }
caption {
display: table-caption
}
th {
font-weight: bolder;
text-align: center
}
caption {
text-align: center
}
h1 {
font-size: 2.4em;
margin: .67em 0;
letter-spacing: 0px;
}
h2 {
text-transform: none;
font-size: 2em;
margin: .75em 0;
letter-spacing: 0px;
}
h3 {
font-size: 1.75em;
margin: .83em 0;
}
h4 {
font-size: 1.25em;
}
h4, p,
blockquote, ul,
fieldset, form,
ol, dl, dir,
menu { margin: 1.12em 0 }
h5 { font-size: 1.25em; margin: 1.5em 0 }
h6 { font-size: 1em; margin: 1.67em 0 }
h1, h2, h3, h4,
h5, h6, b,
strong { font-weight: bolder }
blockquote {
padding: 10px 20px;
background: #e3e3e3;
border-left: 4px solid;
}
i, cite, em,
var, address { font-style: italic }
pre, tt, code,
kbd, samp {
font-family: monospace;
}
pre { white-space: pre }
button, textarea,
input, select { display: inline-block }
big { font-size: 1.17em }
small, sub, sup { font-size: .83em }
sub { vertical-align: sub }
sup { vertical-align: super }
table { border-spacing: 2px; }
thead, tbody,
tfoot { vertical-align: middle }
td, th, tr { vertical-align: inherit }
s, strike, del { text-decoration: line-through }
hr { height: 1px; background: #999; border: none;}
ol, ul, dir,
menu, dd { margin-left: 40px }
ol { list-style-type: decimal }
ol ul, ul ol,
ul ul, ol ol { margin-top: 0; margin-bottom: 0 }
u, ins { text-decoration: underline }
br:before { content: "\A"; white-space: pre-line }
center { text-align: center }
}
}
sass/_wiki-create.scss
form#wiki_revision { form#wiki_revision {
float: left; float: left;
width: flex-grid(7, 9); width: flex-grid(6, 9);
margin-right: flex-gutter(9); margin-right: flex-gutter(9);
label { label {
display: block; display: block;
margin-bottom: 7px ; margin-bottom: 7px ;
} }
textarea { textarea {
@include box-sizing(border-box); @include box-sizing(border-box);
margin-bottom: 20px; margin-bottom: 20px;
...@@ -33,8 +31,8 @@ form#wiki_revision { ...@@ -33,8 +31,8 @@ form#wiki_revision {
#wiki_edit_instructions { #wiki_edit_instructions {
float: left; float: left;
width: flex-grid(2, 9); width: flex-grid(3, 9);
.markdown-example { .markdown-example {
background-color: $light-gray; background-color: $light-gray;
padding-top: 5px; padding-top: 5px;
......
sass/_wiki.scss
...@@ -8,11 +8,11 @@ div.wiki-wrapper { ...@@ -8,11 +8,11 @@ div.wiki-wrapper {
input[type="button"] { input[type="button"] {
@extend h3; @extend h3;
color: lighten($text-color, 10%);
@include transition(); @include transition();
color: lighten($text-color, 10%);
font-size: $body-font-size; font-size: $body-font-size;
margin: 0 !important; margin: 0 !important;
padding: 7px 7px 7px 30px; padding: 7px lh();
text-align: left; text-align: left;
width: 100%; width: 100%;
...@@ -24,31 +24,26 @@ div.wiki-wrapper { ...@@ -24,31 +24,26 @@ div.wiki-wrapper {
ul { ul {
li { li {
&.create-article { &.search {
position: relative; @include box-shadow(0 1px 0 #eee);
border-bottom: 1px solid #d3d3d3;
padding: 7px lh();
h3 { label {
position: relative; display: none;
}
&: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 { &.create-article {
&:before { h3 {
background-image: url(images/ui-icons_454545_256x240.png) -64px -16px no-repeat; a {
} padding: 7px lh();
} }
} }
} }
} }
} }
div#wiki_create_form { div#wiki_create_form {
@extend .clearfix; @extend .clearfix;
padding: 15px; padding: 15px;
...@@ -63,6 +58,8 @@ div.wiki-wrapper { ...@@ -63,6 +58,8 @@ div.wiki-wrapper {
} }
ul { ul {
list-style: none;
li { li {
float: left; float: left;
...@@ -77,7 +74,7 @@ div.wiki-wrapper { ...@@ -77,7 +74,7 @@ div.wiki-wrapper {
section.wiki-body { section.wiki-body {
@extend .content; @extend .content;
header { header {
@extend .topbar; @extend .topbar;
...@@ -91,6 +88,7 @@ div.wiki-wrapper { ...@@ -91,6 +88,7 @@ div.wiki-wrapper {
ul { ul {
float: right; float: right;
list-style: none;
li { li {
float: left; float: left;
...@@ -108,7 +106,7 @@ div.wiki-wrapper { ...@@ -108,7 +106,7 @@ div.wiki-wrapper {
font-size: 12px; font-size: 12px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1px; letter-spacing: 1px;
padding: 15px; padding: lh(.75);
margin: 0; margin: 0;
&:hover { &:hover {
...@@ -129,5 +127,11 @@ div.wiki-wrapper { ...@@ -129,5 +127,11 @@ div.wiki-wrapper {
p { p {
line-height: 1.6em; line-height: 1.6em;
} }
#wiki_history_table {
tr.dark {
background-color: $light-gray;
}
}
} }
} }
sass/application.scss
...@@ -8,13 +8,13 @@ ...@@ -8,13 +8,13 @@
@import "leanmodal"; @import "leanmodal";
// pages // pages
@import "courseware"; @import "courseware", "courseware-video";
@import "textbook"; @import "textbook";
@import "profile"; @import "profile";
@import "wiki-create", "wiki"; @import "wiki-basic-html", "wiki-create", "wiki";
@import "activation"; @import "activation";
@import "help"; @import "help";
@import "discussion", "discussion-questions", "askbot-original"; @import "askbot-original", "discussion", "discussion-questions", "discussion-tags" ;
// left over // left over
@import "theme"; @import "theme";
......
sass/marketing.scss
@import "bourbon/bourbon"; @import "bourbon/bourbon";
@import "reset"; @import "reset";
@import "font-face";
// pages // pages
@import "index-functions", "index-variables", "index"; @import "index-functions", "index-variables", "index-extends", "index";
@import "leanmodal"; @import "leanmodal";
seq_module.html
...@@ -4,8 +4,8 @@ ...@@ -4,8 +4,8 @@
<li class="seq_inactive" id="tt_${ t }">&nbsp;</li> <li class="seq_inactive" id="tt_${ t }">&nbsp;</li>
% endfor % endfor
<li id="${ id }prev">Previous</li> <li id="${ id }next" class="next">Next</li>
<li id="${ id }next">Next</li> <li id="${ id }prev" class="prev">Previous</li>
</ol> </ol>
......
seq_module.js
...@@ -44,7 +44,7 @@ function ${ id }goto(i) { ...@@ -44,7 +44,7 @@ function ${ id }goto(i) {
${ id }loc=i; ${ id }loc=i;
//$('#tt_'+i).attr("style", "background-color:red"); //$('#tt_'+i).attr("style", "background-color:red");
$('#tt_'+i).removeClass(); $('#tt_'+i).removeClass();
$('#tt_'+i).addClass("seq_active"); $('#tt_'+i).addClass("seq_"+${ id }types[${ id }loc]+"_active");
MathJax.Hub.Queue(["Typeset",MathJax.Hub]); MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
} }
......
simplewiki_base.html
...@@ -88,19 +88,9 @@ ...@@ -88,19 +88,9 @@
%> %>
<ul class="action"> <ul class="action">
<li> <!-- <li> -->
<div class="wiki_box_title">Search</div> <!-- <input type="button" onclick="javascript:location.href='${reverse("wiki_random", args=[])}'" value="Random article" class="button" /> -->
<form method="POST" action='${reverse("wiki_search_articles", args=[])}'> <!-- </li> -->
<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=[])}'" value="Random article" class="button" />
</li>
<li> <li>
<input type="button" onclick="javascript:location.href='${reverse("wiki_list_articles", args=[])}'" value="All articles" class="button" /> <input type="button" onclick="javascript:location.href='${reverse("wiki_list_articles", args=[])}'" value="All articles" class="button" />
</li> </li>
...@@ -139,6 +129,17 @@ ...@@ -139,6 +129,17 @@
</form> </form>
</div> </div>
</li> </li>
<li class="search">
<form method="POST" action='${reverse("wiki_search_articles", args=[])}'>
<label class="wiki_box_title">Search</label>
<div style="display:none">
<input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}"/>
</div>
<input type="text" placeholder="Search" 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>
</ul> </ul>
</div> </div>
......
simplewiki_error.html
...@@ -74,6 +74,10 @@ ${wiki_error} ...@@ -74,6 +74,10 @@ ${wiki_error}
<p> <p>
The article you tried to access has been deleted. You may be able to restore it to an earlier version in its <a href="${reverse("wiki_history", args=[wiki_article.get_url(),1])}">history</a>, or <a href="${reverse("wiki_edit", args=[wiki_article.get_url()])}">create a new version</a>. The article you tried to access has been deleted. You may be able to restore it to an earlier version in its <a href="${reverse("wiki_history", args=[wiki_article.get_url(),1])}">history</a>, or <a href="${reverse("wiki_edit", args=[wiki_article.get_url()])}">create a new version</a>.
</p> </p>
%elif wiki_err_norevision is not UNDEFINED:
<p>
This article does not contain revision ${wiki_err_norevision | h}.
</p>
%else: %else:
<p> <p>
An error has occured. An error has occured.
......
simplewiki_history.html
...@@ -60,17 +60,18 @@ ${ wiki_article.title } ...@@ -60,17 +60,18 @@ ${ wiki_article.title }
<tr> <tr>
<td colspan="4"> <td colspan="4">
%if wiki_prev_page: %if wiki_prev_page:
<a href="${reverse("wiki_history", args=[wiki_article.get_url(), wiki_prev_page])}">trans "Previous page"</a> <a href="${reverse("wiki_history", args=[wiki_article.get_url(), wiki_prev_page])}">Previous page</a>
%endif %endif
%if wiki_next_page: %if wiki_next_page:
<a href="${reverse("wiki_history", args=[wiki_article.get_url(), wiki_next_page])}">"Next page"</a> <a href="${reverse("wiki_history", args=[wiki_article.get_url(), wiki_next_page])}">Next page</a>
%endif %endif
</td> </td>
</tr> </tr>
</tfoot> </tfoot>
%endif %endif
</table> </table>
<input type="submit" name="change" value="Change revision" <input type="submit" name="view" value="View revision"/>
<input type="submit" name="change" value="Change to revision"
%if not wiki_write: %if not wiki_write:
disabled="true" disabled="true"
%endif %endif
......
simplewiki_instructions.html
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<p class="markdown-example">circuit:basic</p> <p class="markdown-example">circuit:basic</p>
<p class="markdown-example"><span>$</span>LaTeX Math Expression<span>$</span></p> <p class="markdown-example"><span>$</span>LaTeX Math Expression<span>$</span></p>
To create a new wiki article, create a link to it. Clicking the link gives you the creation page. To create a new wiki article, create a link to it. Clicking the link gives you the creation page.
<p class="markdown-example">[Article](/wiki/view/Article/Child/)</p> <p class="markdown-example">[Article](/wiki/view/Article/)</p>
Other useful examples:<br> Other useful examples:<br>
<p class="markdown-example">[Link](http://google.com)</p> <p class="markdown-example">[Link](http://google.com)</p>
<p class="markdown-example">Huge Header <p class="markdown-example">Huge Header
......
simplewiki_view.html
...@@ -8,6 +8,6 @@ ...@@ -8,6 +8,6 @@
<%block name="wiki_body"> <%block name="wiki_body">
<div id="wiki_article"> <div id="wiki_article">
${ wiki_article.current_revision.contents_parsed| n} ${ wiki_article_revision.contents_parsed| n}
</div> </div>
</%block> </%block>
video.html
<div class="video-wrapper"> <div class="video-wrapper">
<div id="ytapiplayer"> <div class="video-player">
<div id="ytapiplayer">
</div>
<iframe id="html5_player" type="text/html" frameborder="0">
</iframe>
</div> </div>
<!-- TODO(Ernie/Kyle) move styles to css -->
<iframe id="html5_player" type="text/html" frameborder="0">
</iframe>
<section class="video-controls">
<ul>
<li><span class="ui-icon ui-icon-play" onclick="play();"></span></li>
<li><span class="ui-icon ui-icon-pause" onclick="pause();"></span></li>
</ul>
<section class="video-controls">
<ul>
<li><span class="ui-icon ui-icon-play" onclick="play();"></span></li>
<li><span class="ui-icon ui-icon-pause" onclick="pause();"></span></li>
</ul>
<div id="slider"></div> <div id="slider"></div>
<div id="vidtime">0:00/0:00</div> <div id="vidtime">0:00/0:00</div>
<div id="video_speeds"></div> <div id="video_speeds"></div>
</section> </section>
</div>
</div>
<ol class="subtitles"> <ol class="subtitles">
<li id=stt_n5><div id=std_n7 onclick="title_seek(-7);"></div></li> <li id="stt_n5"><div id="std_n7" onclick="title_seek(-7);"></div></li>
<li id=stt_n4><div id=std_n6 onclick="title_seek(-6);"></div></li> <li id="stt_n4"><div id="std_n6" onclick="title_seek(-6);"></div></li>
<li id=stt_n4><div id=std_n5 onclick="title_seek(-5);"></div></li> <li id="stt_n4"><div id="std_n5" onclick="title_seek(-5);"></div></li>
<li id=stt_n4><div id=std_n4 onclick="title_seek(-4);"></div></li> <li id="stt_n4"><div id="std_n4" onclick="title_seek(-4);"></div></li>
<li id=stt_n3><div id=std_n3 onclick="title_seek(-3);"></div></li> <li id="stt_n3"><div id="std_n3" onclick="title_seek(-3);"></div></li>
<li id=stt_n2><div id=std_n2 onclick="title_seek(-2);"></div></li> <li id="stt_n2"><div id="std_n2" onclick="title_seek(-2);"></div></li>
<li id=stt_n1><div id=std_n1 onclick="title_seek(-1);"></div></li> <li id="stt_n1"><div id="std_n1" onclick="title_seek(-1);"></div></li>
<li id=stt_0 class="current"><div id=std_0 onclick="title_seek(0);"></div></li> <li id="stt_0 "class="current"><div id="std_0" onclick="title_seek(0);"></div></li>
<li id=stt_p1><div id=std_p1 onclick="title_seek( 1);"></div></li> <li id="stt_p1"><div id="std_p1" onclick="title_seek( 1);"></div></li>
<li id=stt_p2><div id=std_p2 onclick="title_seek( 2);"></div></li> <li id="stt_p2"><div id="std_p2" onclick="title_seek( 2);"></div></li>
<li id=stt_p3><div id=std_p3 onclick="title_seek( 3);"></div></li> <li id="stt_p3"><div id="std_p3" onclick="title_seek( 3);"></div></li>
<li id=stt_p4><div id=std_p4 onclick="title_seek( 4);"></div></li> <li id="stt_p4"><div id="std_p4" onclick="title_seek( 4);"></div></li>
<li id=stt_p5><div id=std_p5 onclick="title_seek( 5);"></div></li> <li id="stt_p5"><div id="std_p5" onclick="title_seek( 5);"></div></li>
<li id=stt_p6><div id=std_p7 onclick="title_seek( 6);"></div></li> <li id="stt_p6"><div id="std_p7" onclick="title_seek( 6);"></div></li>
<li id=stt_p6><div id=std_p7 onclick="title_seek( 7);"></div></li> <li id="stt_p6"><div id="std_p7" onclick="title_seek( 7);"></div></li>
<li id=stt_p6><div id=std_p7 onclick="title_seek( 8);"></div></li> <li id="stt_p6"><div id="std_p7" onclick="title_seek( 8);"></div></li>
</ol> </ol>
video_init.js
var streams=${ streams } var streams=${ streams }
var params = { allowScriptAccess: "always", bgcolor: "#cccccc", wmode: "transparent" }; var params = { allowScriptAccess: "always", bgcolor: "#cccccc", wmode: "transparent", allowFullScreen: "true" };
var atts = { id: "myytplayer" }; var atts = { id: "myytplayer" };
// If the user doesn't have flash, use the HTML5 Video instead. YouTube's // If the user doesn't have flash, use the HTML5 Video instead. YouTube's
// iFrame API which supports HTML5 is still developmental so it is not default // iFrame API which supports HTML5 is still developmental so it is not default
if (swfobject.hasFlashPlayerVersion("10.1")){ if (swfobject.hasFlashPlayerVersion("10.1")){
swfobject.embedSWF("http://www.youtube.com/apiplayer?enablejsapi=1&playerapiid=ytplayer?wmode=transparent", swfobject.embedSWF("http://www.youtube.com/apiplayer?enablejsapi=1&playerapiid=ytplayer?wmode=transparent",
"ytapiplayer", "640", "385", "8", null, null, params, atts); "ytapiplayer", "640", "385", "8", null, null, params, atts);
} else { } else {
//end of this URL may need &origin=http://..... once pushed to production to prevent XSS //end of this URL may need &origin=http://..... once pushed to production to prevent XSS
$("#html5_player").attr("src", "http://www.youtube.com/embed/" + streams["1.0"] + "?enablejsapi=1"); $("#html5_player").attr("src", "http://www.youtube.com/embed/" + streams["1.0"] + "?enablejsapi=1&controls=0");
$("#html5_player").show(); $("#html5_player").show();
var tag = document.createElement('script'); var tag = document.createElement('script');
...@@ -18,6 +18,7 @@ if (swfobject.hasFlashPlayerVersion("10.1")){ ...@@ -18,6 +18,7 @@ if (swfobject.hasFlashPlayerVersion("10.1")){
var firstScriptTag = document.getElementsByTagName('script')[0]; var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// Make sure the callback is called once API ready, YT seems to be buggy
loadHTML5Video(); loadHTML5Video();
} }
var captions=0; var captions=0;
...@@ -25,7 +26,7 @@ $("#slider").slider({slide:function(event,ui){seek_slide('slide',event.originalE ...@@ -25,7 +26,7 @@ $("#slider").slider({slide:function(event,ui){seek_slide('slide',event.originalE
stop:function(event,ui){seek_slide('stop',event.originalEvent,ui.value);}}); stop:function(event,ui){seek_slide('stop',event.originalEvent,ui.value);}});
function good() { function good() {
window['console'].log(ytplayer.getCurrentTime()); window['console'].log(ytplayer.getCurrentTime());
} }
ajax_video=good; ajax_video=good;
...@@ -36,8 +37,8 @@ function add_speed(key, stream) { ...@@ -36,8 +37,8 @@ function add_speed(key, stream) {
var id = 'speed_' + stream; var id = 'speed_' + stream;
$("#video_speeds").append(' <span id="'+id+'">'+key+'X</span>'); $("#video_speeds").append(' <span id="'+id+'">'+key+'X</span>');
$("#"+id).click(function(){ $("#"+id).click(function(){
change_video_speed(key, stream); change_video_speed(key, stream);
}); });
} }
var l=[] var l=[]
...@@ -57,4 +58,3 @@ l.sort(sort_by_value); ...@@ -57,4 +58,3 @@ l.sort(sort_by_value);
for(var i=0; i<l.length; i++) { for(var i=0; i<l.length; i++) {
add_speed(l[i], streams[l[i]]) add_speed(l[i], streams[l[i]])
} }
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