Commit 478372bd by Bridger Maxwell

Bringing development branch back up to default

--HG--
branch : bridger-dev
parents 4838ab1b 8ebb6273
...@@ -26,13 +26,32 @@ someone else already signed up with that username. Try a different, ...@@ -26,13 +26,32 @@ someone else already signed up with that username. Try a different,
more unique username. For example, try adding a random number to the more unique username. For example, try adding a random number to the
end.</p> end.</p>
<h2> I forgot my password </h2>
<p> The log-in form will have a link to reset your password once the
course opens. </p>
<h2> The videos stall out </h2>
<p> You should confirm your internet connection is fast enough to stream
videos, and that Youtube is not blocked by your internet
provider. Since the videos are hosted by YouTube, we have no control
over most technical problems with video playback (aside from those
related specifically to our player). </p>
<p> You should also confirm you have a current version of Flash installed.
While our player supports YouTube's HTML5 API (which allows playback without
Flash), this support is experimental.</p>
<a name="othercourses" ></a>
<h2> I am interested in a different subject. What other courses do <h2> I am interested in a different subject. What other courses do
you offer? </h2> you offer? </h2>
<p> 6.002x is the pilot course for MITx. While we plan to offer a <p> 6.002x is the pilot course for MITx. While we plan to offer a
range of courses in the future, at present, 6.002x is the only course range of courses in the future, at present, 6.002x is the only course
available.</p> available. Specific future offerings will be announced later. </p>
<a name="start" ></a>
<h2>How will I know that the course has started?</h2> <h2>How will I know that the course has started?</h2>
<p> The course will start on March 5. Check the website <p> The course will start on March 5. Check the website
...@@ -41,17 +60,23 @@ the course website 6.002x.mitx.mit.edu on or slightly before March 5 ...@@ -41,17 +60,23 @@ the course website 6.002x.mitx.mit.edu on or slightly before March 5
so you can login, begin to get familiar with the site and start the so you can login, begin to get familiar with the site and start the
course.</p> course.</p>
<h2> Why is there no log-in button?</h2> <a name="login" ></a>
<h2> I can't log in</h2>
<p> You will not be able to log into the course until either the <p> You will not be able to log into the course until either the
starting date, or shortly before.</p> starting date, or shortly before. If you have problems logging in once
the course has started, please verify that you are using the latest
version of either Firefox or Google Chrome, and have JavaScript and
cookies enabled. </p>
<a name="schedule" ></a>
<h2> Does the class have a schedule?</h2> <h2> Does the class have a schedule?</h2>
<p> The lectures are on-line videos, and may be watched at your own <p> The lectures are on-line videos, and may be watched at your own
pace and schedule. The course will have fixed deadlines for homework pace and schedule. The course will have fixed deadlines for homework
assignments and exams. </p> assignments and exams. </p>
<a name="enrollissues" ></a>
<h2> I just enrolled for the course. I have not received any form <h2> I just enrolled for the course. I have not received any form
of acknowledgement that I have enrolled.</h2> of acknowledgement that I have enrolled.</h2>
...@@ -59,7 +84,8 @@ of acknowledgement that I have enrolled.</h2> ...@@ -59,7 +84,8 @@ of acknowledgement that I have enrolled.</h2>
most common issues are: most common issues are:
<ul> <ul>
<li> Typo in e-mail address <li> Typo in e-mail address
<li> Old browser. We recommend trying a modern version of Firefox or Chrome <li> Old browser. We recommend downloading the current version of
Firefox or Chrome. The course requires a modern browser.
<li> JavaScript disabled <li> JavaScript disabled
<li> Activation e-mail in spam folder. Check spam folder. <li> Activation e-mail in spam folder. Check spam folder.
<li> Non-unique username. Try adding a random string at the end. <li> Non-unique username. Try adding a random string at the end.
...@@ -69,11 +95,13 @@ most common issues are: ...@@ -69,11 +95,13 @@ most common issues are:
to do anything about the old account, if any. If it is not activated to do anything about the old account, if any. If it is not activated
through the link in the e-mail, it will disappear later. through the link in the e-mail, it will disappear later.
<a name="howdropcourse" ></a>
<h2> How do I drop the course?</h2> <h2> How do I drop the course?</h2>
<p> You do not have to do anything. You can simply stop working on the <p> You do not have to do anything. You can simply stop working on the
course at any time you choose to do so.</p> course at any time you choose to do so.</p>
<a name="ifdropcourse" ></a>
<h2>What happens if I drop the course?</h2> <h2>What happens if I drop the course?</h2>
<p> For the prototype course, learners achieving grades of "A," "B," <p> For the prototype course, learners achieving grades of "A," "B,"
...@@ -85,6 +113,7 @@ will be disclosed outside of MITx. You can also choose to opt for a ...@@ -85,6 +113,7 @@ will be disclosed outside of MITx. You can also choose to opt for a
no record at any time. However, the posts you make while enrolled in no record at any time. However, the posts you make while enrolled in
the class will remain visible. </p> the class will remain visible. </p>
<a name="whatismitx" ></a>
<h2> <h2>
What is <i>MITx</i>?</h2> What is <i>MITx</i>?</h2>
...@@ -113,6 +142,7 @@ education. The launch of <i>MITx</i> represents a next step forward in that ...@@ -113,6 +142,7 @@ education. The launch of <i>MITx</i> represents a next step forward in that
effort. effort.
</p> </p>
<a name="differentcampus" ></a>
<h2> <h2>
What is 6.002x, and how is it different from the on-campus version of What is 6.002x, and how is it different from the on-campus version of
6.002? 6.002?
...@@ -142,6 +172,7 @@ version of 6.002. ...@@ -142,6 +172,7 @@ version of 6.002.
professors Anant Agarwal and Jeffrey H. Lang for 6.002. professors Anant Agarwal and Jeffrey H. Lang for 6.002.
</p> </p>
<a name="howenroll" ></a>
<h2> <h2>
How do I enroll in 6.002x? How do I enroll in 6.002x?
</h2> </h2>
...@@ -150,6 +181,7 @@ To enroll, visit <a href="http://mitx.mit.edu">http://mitx.mit.edu</a> ...@@ -150,6 +181,7 @@ To enroll, visit <a href="http://mitx.mit.edu">http://mitx.mit.edu</a>
and sign up. and sign up.
</p> </p>
<a name="whenavailable" ></a>
<h2> <h2>
When will the course be available online? When will the course be available online?
</h2> </h2>
...@@ -158,6 +190,7 @@ When will the course be available online? ...@@ -158,6 +190,7 @@ When will the course be available online?
6.002x will become available online on Monday, March 5. 6.002x will become available online on Monday, March 5.
</p> </p>
<a name="timeline" ></a>
<h2> <h2>
Do I need to follow a set timeline in completing 6.002x? Do I need to follow a set timeline in completing 6.002x?
</h2> </h2>
...@@ -169,6 +202,7 @@ final exam will be given within a specific range of days. However, ...@@ -169,6 +202,7 @@ final exam will be given within a specific range of days. However,
faster-paced learners can proceed multiple weeks ahead if they choose. faster-paced learners can proceed multiple weeks ahead if they choose.
</p> </p>
<a name="workrequired" ></a>
<h2> <h2>
How much time is required to complete the course? How much time is required to complete the course?
</h2> </h2>
...@@ -178,6 +212,7 @@ course. However, the time taken by individual students might vary ...@@ -178,6 +212,7 @@ course. However, the time taken by individual students might vary
considerably depending on background and skill. considerably depending on background and skill.
</p> </p>
<a name="instructors" ></a>
<h2> <h2>
Who are the instructors for 6.002x? Who are the instructors for 6.002x?
</h2> </h2>
...@@ -187,6 +222,7 @@ Gerald Sussman and Piotr Mitros. The team also includes several ...@@ -187,6 +222,7 @@ Gerald Sussman and Piotr Mitros. The team also includes several
teaching assistants (TAs). teaching assistants (TAs).
</p> </p>
<a name="worklike" ></a>
<h2> <h2>
What is the work like in 6.002x? What is the work like in 6.002x?
</h2> </h2>
...@@ -208,6 +244,7 @@ videos. Lab and homework exercises will round out the week. Tutorials ...@@ -208,6 +244,7 @@ videos. Lab and homework exercises will round out the week. Tutorials
are also provided as additional reference material. are also provided as additional reference material.
</p> </p>
<a name="questionsduringcourse" ></a>
<h2> <h2>
What if I have a question during the course? What if I have a question during the course?
</h2> </h2>
...@@ -218,6 +255,7 @@ documents, FAQs, tutorials and videos on using the various components ...@@ -218,6 +255,7 @@ documents, FAQs, tutorials and videos on using the various components
of the course will also be provided. of the course will also be provided.
</p> </p>
<a name="collaboration" ></a>
<h2> <h2>
Will 6.002x offer any means for collaboration among online learners? Will 6.002x offer any means for collaboration among online learners?
</h2> </h2>
...@@ -226,6 +264,7 @@ Yes. 6.002x will offer modest support for collaborative work through a ...@@ -226,6 +264,7 @@ Yes. 6.002x will offer modest support for collaborative work through a
prototype wiki and discussion forum. prototype wiki and discussion forum.
</p> </p>
<a name="prereqs" ></a>
<h2> <h2>
Are there prerequisites to take the course? Are there prerequisites to take the course?
</h2> </h2>
...@@ -248,6 +287,7 @@ remedial differential equations component for students with weaker ...@@ -248,6 +287,7 @@ remedial differential equations component for students with weaker
math backgrounds. math backgrounds.
</p> </p>
<a name="cost" ></a>
<h2> <h2>
How much does the course cost? How much does the course cost?
</h2> </h2>
...@@ -255,21 +295,24 @@ How much does the course cost? ...@@ -255,21 +295,24 @@ How much does the course cost?
All of the courses on <i>MITx</i> will be free of charge. Those who have the All of the courses on <i>MITx</i> will be free of charge. Those who have the
ability and motivation to demonstrate mastery of content can receive a ability and motivation to demonstrate mastery of content can receive a
credential for a modest fee. For this prototype course, the fee for a credential for a modest fee. For this prototype course, the fee for a
credential will be waived. credential will be waived.
</p> </p>
<a name="credential" ></a>
<h2> <h2>
What is a credential? What is a credential?
</h2> </h2>
<p> <p>
Any learner who successfully completes 6.002x will receive an Any learner who successfully completes 6.002x will receive an
electronic certificate indicating a grade. This certificate will electronic certificate indicating a grade. This certificate will
indicate that you earned it from <i>MITx</i>&rsquo;s pilot course. In this indicate that you earned it from <i>MITx</i>&rsquo;s pilot course. In
prototype version, <i>MITx</i> will not require that you be tested in a this prototype version, <i>MITx</i> will not require that you be
testing center or otherwise have your identity certified in order to tested in a testing center or otherwise have your identity certified
receive this certificate. in order to receive this certificate. MITx certificates are not
planned to count towards MIT course credit.
</p> </p>
<a name="whograding" ></a>
<h2> <h2>
Who is grading the course? Who is grading the course?
</h2> </h2>
...@@ -278,6 +321,7 @@ Who is grading the course? ...@@ -278,6 +321,7 @@ Who is grading the course?
including practice exercises, homework assignments, labs and exams. including practice exercises, homework assignments, labs and exams.
</p> </p>
<a name="whatpassing" ></a>
<h2> <h2>
What is a passing grade? What is a passing grade?
</h2> </h2>
...@@ -288,6 +332,7 @@ affecting a student&rsquo;s grade and the grade thresholds will be ...@@ -288,6 +332,7 @@ affecting a student&rsquo;s grade and the grade thresholds will be
posted on the course website when the course comes online. posted on the course website when the course comes online.
</p> </p>
<a name="textbook" ></a>
<h2> <h2>
Do I need to buy a textbook? Do I need to buy a textbook?
</h2> </h2>
...@@ -299,30 +344,38 @@ provided electronically as part of the online course. While the ...@@ -299,30 +344,38 @@ provided electronically as part of the online course. While the
textbook is recommended, it is not required. The electronic text is textbook is recommended, it is not required. The electronic text is
provided for personal use in connection with this course only. The provided for personal use in connection with this course only. The
copyright for the book is owned by Elsevier. The book can be purchased copyright for the book is owned by Elsevier. The book can be purchased
on Amazon. on <a href="http://www.amazon.com/exec/obidos/ASIN/1558607358/ref=nosim/mitopencourse-20" target="_blank">Amazon</a>.
</p> </p>
<a name="technicalrequirements" ></a>
<h2> <h2>
Do I need to have special software to access 6.002x? Do I need to have special software to access 6.002x?
</h2> </h2>
<p> <p>
No, you do not need special software to access 6.002x, as you will No, you do not need special software to access 6.002x, as you will
access the online interactive course through your browser. The course access the online interactive course through your browser. The course
website was developed and tested primarily with Google Chrome. We website was developed and tested primarily with the current version of
support current versions of Mozilla Firefox as well. The video player Google Chrome. We support current versions of Mozilla Firefox as
is designed to work with Flash. While we provide a partial non-Flash well. The video player is based on Youtube, and is designed to work
fallback for the video, as well as partial support for Internet with Flash. We provide a partial non-Flash fallback for the video, but
Explorer, other browsers and tablets, portions of the functionality this uses Google's experimental HTML5 API, and hence we cannot
will be unavailable. guarantee those will continue to function for the duration of the
semester. We provide partial support for Internet Explorer, as well as
other browsers and tablets, but portions of the functionality will be
unavailable.
</p> </p>
<a name="futurecourses" ></a>
<h2> <h2>
When will the next courses become available and what topics will they be on? When will the next courses become available and what topics will they be on?
</h2> </h2>
<p> <p>
Additional courses will be announced Additional courses will be announced
on <a href="http://mitx.mit.edu">mitx.mit.edu</a> as they become on <a href="http://mitx.mit.edu">mitx.mit.edu</a> as they become
available. We expect this will happen in fall 2012. available. We expect this will happen in fall 2012. We also have
accounts
on <a href="https://twitter.com/#!/MyMITx">Twitter</a>, <a href="http://www.facebook.com/pages/MITx/378592442151504">Facebook</a>,
and <a href="http://www.linkedin.com/groups/Friends-Alumni-MITx-4316538">LinkedIn</a>.
</p> </p>
</div> </div>
</section> </section>
...@@ -8,6 +8,6 @@ ...@@ -8,6 +8,6 @@
<!-- <p>Now go <a href="/">log in</a> and try the course!</a></p> --> <!-- <p>Now go <a href="/">log in</a> and try the course!</a></p> -->
<p> This account has already been activated. We will notify you as <p> This account has already been activated. We will notify you as
soon as the course starts.</p> soon as the course starts.</p>
<p>For now you can go to the <a href="https://mitx.mit.edu/">MITx homepage</a> or the <a href="/">6.002x course page</a>.</p> <p>For now you can go to the <a href="http://mitx.mit.edu/">MITx homepage</a> or the <a href="/">6.002x course page</a>.</p>
</div> </div>
</section> </section>
...@@ -5,6 +5,6 @@ ...@@ -5,6 +5,6 @@
<h1>Activation Complete!</h1> <h1>Activation Complete!</h1>
<!-- <p>Now go <a href="/">log in</a> and try the course!</a></p> --> <!-- <p>Now go <a href="/">log in</a> and try the course!</a></p> -->
<p>Thanks for activating your email. We will notify you as soon as the course starts.</p> <p>Thanks for activating your email. We will notify you as soon as the course starts.</p>
<p>For now you can go to the <a href="https://mitx.mit.edu/">MITx homepage</a> or the <a href="/">6.002x course page</a>.</p> <p>For now you can go to the <a href="http://mitx.mit.edu/">MITx homepage</a> or the <a href="/">6.002x course page</a>.</p>
</div> </div>
</section> </section>
<%inherit file="main.html" /> <%inherit file="main.html" />
<%block name="js_extra">
<!-- TODO: http://docs.jquery.com/Plugins/Validation --> <!-- TODO: http://docs.jquery.com/Plugins/Validation -->
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
${init} ${init}
// Show and hide sidebar $(".sequence-nav li a").hover(function(){
var acc_hidden=false; $(this).siblings().toggle();
$('#hide_acc').click(function() {
if(acc_hidden) {
$('#accordion').show();
$('#acc_td').attr("width","320");
$('#hide_acc').html("&lt;<br>&lt;<br>&lt;");
acc_hidden=false;
} else {
$('#accordion').hide();
$('#acc_td').attr("width","0");
$('#hide_acc').html("&gt;<br>&gt;<br>&gt;");
acc_hidden=true;
}
}); });
}); });
</script> </script>
</%block>
<%include file="navigation.html" args="active_page='courseware'" /> <%include file="navigation.html" args="active_page='courseware'" />
<section class="main-content"> <section class="main-content">
<div class="course-wrapper"> <div class="course-wrapper">
<section class="course-index"> <section class="course-index">
<div id="open_close_accordion"> <header id="open_close_accordion">
<h2>Courseware Index</h2> <h2>Courseware Index</h2>
<a href="#">close</a> <a href="#">close</a>
</div> </header>
<div id="accordion"> <div id="accordion">
${accordion} ${accordion}
......
...@@ -2,8 +2,9 @@ ...@@ -2,8 +2,9 @@
<div name="enroll_form" id="enroll_form"> <div name="enroll_form" id="enroll_form">
<h1>Enroll in 6.002x Circuits &amp; Electronics</h1> <h1>Enroll in 6.002x Circuits &amp; Electronics</h1>
<!--[if lte IE 8]>
<p class="ie-warning"> Enrollment requires a modern web browser with JavaScript enabled. You don't have this. You can&rsquo;t enroll without upgrading, since you couldn&rsquo;t take the course without upgrading. Feel free to download the latest version of <a href="http://www.mozilla.org/en-US/firefox/new/">Mozilla Firefox</a> or <a href="http://support.google.com/chrome/bin/answer.py?hl=en&answer=95346">Google Chrome</a>, for free, to enroll and take this course.</p> <p class="ie-warning"> Enrollment requires a modern web browser with JavaScript enabled. You don't have this. You can&rsquo;t enroll without upgrading, since you couldn&rsquo;t take the course without upgrading. Feel free to download the latest version of <a href="http://www.mozilla.org/en-US/firefox/new/">Mozilla Firefox</a> or <a href="http://support.google.com/chrome/bin/answer.py?hl=en&answer=95346">Google Chrome</a>, for free, to enroll and take this course.</p>
<![endif]-->
<form name="enroll" id="enroll_form" method="get"> <form name="enroll" id="enroll_form" method="get">
<fieldset><% if 'error' in locals(): e = error %> <fieldset><% if 'error' in locals(): e = error %>
......
...@@ -9,7 +9,14 @@ ...@@ -9,7 +9,14 @@
<h2>Self-help</h2> <h2>Self-help</h2>
<ul> <ul>
<li>Ask on the <a href="/discussion">discussion forums</a></li> <li>Read
the <a href="http://mitx.mit.edu/6002x-faq.html">FAQ</a>
carefully</li>
<li>Check the <a href="/info">course updates</a> -- we will
announce major errors and issues there </li>
<li>Check whether the issues has been asked on
the <a href="/discussion">discussion forums</a>, and if not,
ask</li>
<li>Ask in the IRC channel (irc.mitx.mit.edu, channel #6002)]</li> <li>Ask in the IRC channel (irc.mitx.mit.edu, channel #6002)]</li>
<li>Check the <a href="/info">course handouts.</a></li> <li>Check the <a href="/info">course handouts.</a></li>
</ul> </ul>
...@@ -31,7 +38,12 @@ ...@@ -31,7 +38,12 @@
<dd><a href="mailto:suggestions@mitx.mit.edu">suggestions@mitx.mit.edu</a></dd> <dd><a href="mailto:suggestions@mitx.mit.edu">suggestions@mitx.mit.edu</a></dd>
</dl> </dl>
<p> Please bear in mind that while we read them, we do not expect to <p> Please bear in mind that while we read them, we do not
have time to respond to all e-mails.</p> expect to have time to respond to all e-mails. For technical
questions, please make sure you are using the latest version
of <a href="http://www.mozilla.org/en-US/firefox/new/">Firefox</a>
or <a href="https://www.google.com/chrome/">Chrome</a>, and
include browser and version in your e-mail, as well as
screenshots or other pertinent details. </p>
</section> </section>
</section> </section>
...@@ -27,7 +27,6 @@ ...@@ -27,7 +27,6 @@
<p>The course introduces engineering in the context of the lumped circuit abstraction. Topics covered include: resistive elements and networks; independent and dependent sources; switches and MOS transistors; digital abstraction; amplifiers; energy storage elements; dynamics of first- and second-order networks; design in the time and frequency domains; and analog and digital circuits and applications. Design and lab exercises are also significant components of the course. You should expect to spend approximately 10 hours per week on the course.</p> <p>The course introduces engineering in the context of the lumped circuit abstraction. Topics covered include: resistive elements and networks; independent and dependent sources; switches and MOS transistors; digital abstraction; amplifiers; energy storage elements; dynamics of first- and second-order networks; design in the time and frequency domains; and analog and digital circuits and applications. Design and lab exercises are also significant components of the course. You should expect to spend approximately 10 hours per week on the course.</p>
<!-- <p> The course uses the textbook Foundations of Analog and Digital Electronic Circuits. Agarwal, Anant, and Jeffrey H. Lang. San Mateo, CA: Morgan Kaufmann Publishers, Elsevier, July 2005. ISBN: 9781558607354. While recommended, the book is not required -- relevant section will be provided electronically as part of the on-line course.</p> -->
</section> </section>
<section class="on-mitx"> <section class="on-mitx">
......
...@@ -5,10 +5,10 @@ ...@@ -5,10 +5,10 @@
<section class="main-content"> <section class="main-content">
<div class="info-wrapper"> <div class="info-wrapper">
<section class="updates"> <section class="updates">
<%include file="info_files/updates.html" /> <%include file="updates.html" />
</section> </section>
<section class="handouts"> <section class="handouts">
<%include file="info_files/handouts.html" /> <%include file="handouts.html" />
</section> </section>
</div> </div>
</section> </section>
../data/info/
\ No newline at end of file
...@@ -4,6 +4,9 @@ ...@@ -4,6 +4,9 @@
<h1>Log in to MITx</h1> <h1>Log in to MITx</h1>
<p class="no-account">If you don&rsquo;t have an account yet, <a href="#enroll" rel="leanModal">please enroll here</a></p> <p class="no-account">If you don&rsquo;t have an account yet, <a href="#enroll" rel="leanModal">please enroll here</a></p>
</header> </header>
<!--[if lte IE 8]>
<p class="ie-warning">You are using a browser that is not supported by <em>MITx</em>, and you might not be able to complete pieces of the course. Please download the latest version of <a href="http://www.mozilla.org/en-US/firefox/new/">Firefox</a> or <a href="https://www.google.com/chrome">Chrome</a> to get the full experience.</p>
<![endif]-->
<form id="login_form" method="post"> <form id="login_form" method="post">
<ol> <ol>
......
...@@ -5,16 +5,10 @@ ...@@ -5,16 +5,10 @@
<link rel="stylesheet" href="${ settings.LIB_URL }jquery.treeview.css" type="text/css" media="all" /> <link rel="stylesheet" href="${ settings.LIB_URL }jquery.treeview.css" type="text/css" media="all" />
<link rel="stylesheet" href="/static/css/application.css" type="text/css" media="all" /> <link rel="stylesheet" href="/static/css/application.css" type="text/css" media="all" />
<link href="/static/css/print.css" rel="stylesheet" type="text/css" media="print"/>
<script type="text/javascript" src="${ settings.LIB_URL }jquery-1.6.2.min.js"></script> <script type="text/javascript" src="${ settings.LIB_URL }jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="${ settings.LIB_URL }jquery-ui-1.8.16.custom.min.js"></script> <script type="text/javascript" src="${ settings.LIB_URL }jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="${ settings.LIB_URL }swfobject/swfobject.js"></script> <script type="text/javascript" src="${ settings.LIB_URL }swfobject/swfobject.js"></script>
<script type="text/javascript" src="${ settings.LIB_URL }jquery.treeview.js"></script>
<script type="text/javascript" src="/static/js/jquery.leanModal.min.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/cktsim.js"></script>
<!--[if lt IE 9]> <!--[if lt IE 9]>
<script src="/static/js/html5shiv.js"></script> <script src="/static/js/html5shiv.js"></script>
...@@ -26,18 +20,16 @@ ...@@ -26,18 +20,16 @@
displayMath: [["\\[","\\]"]]} displayMath: [["\\[","\\]"]]}
}); });
</script> </script>
<script type="text/javascript" src="${ settings.LIB_URL }mathjax/MathJax.js?config=TeX-AMS_HTML-full"></script> <script type="text/javascript" src="${ settings.LIB_URL }mathjax-MathJax-c9db6ac/MathJax.js?config=TeX-AMS_HTML-full"></script>
<script type="text/javascript">
$(function(){
$("a[rel*=leanModal]").leanModal();
});
</script>
<%block name="headextra"/> <%block name="headextra"/>
</head> </head>
<body class="<%block name="bodyclass"/>"> <body class="<%block name="bodyclass"/>">
<!--[if lte IE 8]>
<p class="ie-warning">You are using a browser that is not supported by <em>MITx</em>, and you might not be able to complete pieces of the course. Please download the latest version of <a href="http://www.mozilla.org/en-US/firefox/new/">Firefox</a> or <a href="https://www.google.com/chrome">Chrome</a> to get the full experience.</p>
<![endif]-->
${self.body()} ${self.body()}
<%block name="bodyextra"/> <%block name="bodyextra"/>
...@@ -90,6 +82,13 @@ ...@@ -90,6 +82,13 @@
</dl> </dl>
</div> </div>
<script type="text/javascript" src="${ settings.LIB_URL }jquery.treeview.js"></script>
<script type="text/javascript" src="/static/js/jquery.leanModal.min.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/cktsim.js"></script>
<script> <script>
// Feedback form // Feedback form
$(function() { $(function() {
...@@ -115,7 +114,12 @@ $(function() { ...@@ -115,7 +114,12 @@ $(function() {
}); });
}); });
}); });
$(function(){
$("a[rel*=leanModal]").leanModal();
});
</script> </script>
<%block name="js_extra"/>
</body> </body>
</html> </html>
...@@ -23,15 +23,8 @@ ...@@ -23,15 +23,8 @@
<!--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> -->
<!--[if lt IE 9]>
<script src="/static/js/html5shiv.js"></script> <script src="/static/js/html5shiv.js"></script>
<![endif]-->
<script type="text/javascript">
$(function(){
$("a[rel*=leanModal]").leanModal();
});
</script>
<%block name="headextra"/> <%block name="headextra"/>
...@@ -103,7 +96,20 @@ function postJSON(url, data, callback) { ...@@ -103,7 +96,20 @@ function postJSON(url, data, callback) {
<li><a href="/t/honor.html">Honor Code</a></li> <li><a href="/t/honor.html">Honor Code</a></li>
<li><a href="/t/mitx_help.html">Help</a></li> <li><a href="/t/mitx_help.html">Help</a></li>
</ul> </ul>
<ul class="social">
<li class="linkedin">
<a href="http://www.linkedin.com/groups/Friends-Alumni-MITx-4316538">Linked In</a>
</li>
<li class="twitter">
<a href="https://twitter.com/#!/MyMITx">Twitter</a>
</li>
<li class="facebook">
<a href="http://www.facebook.com/pages/MITx/378592442151504">Facebook</a>
</li>
</ul>
</div> </div>
</footer> </footer>
% if settings.COURSEWARE_ENABLED: % if settings.COURSEWARE_ENABLED:
...@@ -128,7 +134,7 @@ $(document).ready(function(){ ...@@ -128,7 +134,7 @@ $(document).ready(function(){
submit_data, submit_data,
function(json) { function(json) {
if(json.success) { if(json.success) {
location.href="/courseware"; location.href="/info";
} else if($('#login_error').length == 0) { } else if($('#login_error').length == 0) {
$('#login_form').prepend('<div id="login_error">Email or password is incorrect.</div>'); $('#login_form').prepend('<div id="login_error">Email or password is incorrect.</div>');
} else { } else {
...@@ -156,7 +162,20 @@ $(document).ready(function(){ ...@@ -156,7 +162,20 @@ $(document).ready(function(){
}); });
}); });
$(function(){
$("a[rel*=leanModal]").leanModal();
$("a.login").click(function(){
$("#login_form #li_email").focus();
});
$("a.enroll").click(function(){
$("#enroll_form #ca_email").focus();
});
});
</script> </script>
<%block name="js_extra"/>
</body> </body>
</html> </html>
...@@ -51,6 +51,8 @@ ...@@ -51,6 +51,8 @@
<iframe id="player" type="text/html" width="560" height="390" src="http://www.youtube.com/embed/p2Q6BrNhdh8?enablejsapi=1" frameborder="0"> <iframe id="player" type="text/html" width="560" height="390" src="http://www.youtube.com/embed/p2Q6BrNhdh8?enablejsapi=1" frameborder="0">
</iframe> </iframe>
</div> </div>
<%block name="js_extra">
<script> <script>
var player; var player;
...@@ -113,3 +115,4 @@ $(function() { ...@@ -113,3 +115,4 @@ $(function() {
}); });
</script> </script>
</%block>
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
reach us at:</p> reach us at:</p>
<dl> <dl>
<dt>System-related questions</dt> <dt>System-related questions</dt>
<dd><a href="mailto:technical@mitx.mit.edu">technical@mitx.mit.edu</a></dd> <dd><a href="mailto:technical@mitx.mit.edu">technical@mitx.mit.edu</a> -- For technical questions, please make sure you are using a current version of <a href="http://www.mozilla.org/en-US/firefox/new/">Firefox</a> or <a href="https://www.google.com/chrome/">Chrome</a>, and include browser and version in your e-mail, as well as screenshots or other pertinent details. </dd>
<dt>Content-related questions</dt> <dt>Content-related questions</dt>
<dd><a href="mailto:content@mitx.mit.edu">content@mitx.mit.edu</a></dd> <dd><a href="mailto:content@mitx.mit.edu">content@mitx.mit.edu</a></dd>
<dt>Bug reports</dt> <dt>Bug reports</dt>
......
...@@ -11,8 +11,8 @@ ...@@ -11,8 +11,8 @@
<li class="courseware"><a href="/courseware">Courseware</a></li> <li class="courseware"><a href="/courseware">Courseware</a></li>
<li class="info"><a href="/info">Course Info</a></li> <li class="info"><a href="/info">Course Info</a></li>
<li class="book"><a href="/book">Textbook</a></li> <li class="book"><a href="/book">Textbook</a></li>
<li class="discussion"><a href="/discussion">Discussion</a></li> <li class="discussion"><a href="/discussion/questions">Discussion</a></li>
<li class="wiki"><a href="/wiki">Wiki</a></li> <li class="wiki"><a href="/wiki/view">Wiki</a></li>
<li class="profile"><a href="/profile">Profile</a></li> <li class="profile"><a href="/profile">Profile</a></li>
</ul> </ul>
</nav> </nav>
......
...@@ -89,7 +89,7 @@ $(function() { ...@@ -89,7 +89,7 @@ $(function() {
<section class="course-info"> <section class="course-info">
<h1>Course Progress</h1> <h1>Course Progress</h1>
<div id="grade-detail-graph" style="width:650px;height:200px;"></div> <div id="grade-detail-graph"></div>
<ol class="chapters"> <ol class="chapters">
%for chapter in chapters: %for chapter in chapters:
...@@ -108,7 +108,7 @@ $(function() { ...@@ -108,7 +108,7 @@ $(function() {
%> %>
<h3><a href="${reverse('courseware_section', args=format_url_params([chapter['course'], chapter['chapter'], section['section']])) }"> <h3><a href="${reverse('courseware_section', args=format_url_params([chapter['course'], chapter['chapter'], section['section']])) }">
${ section['section'] }</a> ${"({0}/{1}) {2}".format( earned, total, percentageString )}</h3> ${ section['section'] }</a> ${"({0:g}/{1:g}) {2}".format( earned, total, percentageString )}</h3>
${section['subtitle']} ${section['subtitle']}
%if 'due' in section and section['due']!="": %if 'due' in section and section['due']!="":
due ${section['due']} due ${section['due']}
...@@ -118,7 +118,7 @@ $(function() { ...@@ -118,7 +118,7 @@ $(function() {
<ol class="scores"> <ol class="scores">
${ "Problem Scores: " if section['graded'] else "Practice Scores: "} ${ "Problem Scores: " if section['graded'] else "Practice Scores: "}
%for score in section['scores']: %for score in section['scores']:
<li class="score">${ score[0] }/${ score[1] }</li> <li class="score">${"{0:g}/{1:g}".format(score[0],score[1])}</li>
%endfor %endfor
</ol> </ol>
%endif %endif
......
...@@ -9,15 +9,18 @@ $(function () { ...@@ -9,15 +9,18 @@ $(function () {
display: 'none', display: 'none',
top: y + 5, top: y + 5,
left: x + 5, left: x + 5,
border: '1px solid #fdd', border: '1px solid #000',
padding: '2px', padding: '4px 6px',
'background-color': '#fee', color: '#fff',
'background-color': '#333',
opacity: 0.90 opacity: 0.90
}).appendTo("body").fadeIn(200); }).appendTo("body").fadeIn(200);
} }
/* -------------------------------- Grade detail bars -------------------------------- */ /* -------------------------------- Grade detail bars -------------------------------- */
var colors = [$.color.parse("#E8B800"), $.color.parse("#A0CEFA"), $.color.parse("#BD3738"), $.color.parse("#429A2E")]; var colors = [ $.color.parse("#b72121"), $.color.parse("#600101"), $.color.parse("#666666"), $.color.parse("#333333")];
// var colors = [ $.color.parse("#2e80ce"), $.color.parse("#14518b"), $.color.parse("#599535"), $.color.parse("#3d731c")];
// var colors = [ $.color.parse("#3f80be"), $.color.parse("#128251"), $.color.parse("#e1b900"), $.color.parse("#d10404")];
//var colors = [$.color.parse("#1B2045"), $.color.parse("#557a00"), $.color.parse("#F5600"), $.color.parse("#FEBA2C")]; //var colors = [$.color.parse("#1B2045"), $.color.parse("#557a00"), $.color.parse("#F5600"), $.color.parse("#FEBA2C")];
//var colors = [$.color.parse("#E7C856"), $.color.parse("#CD462E"), $.color.parse("#B01732"), $.color.parse("#41192A")]; //var colors = [$.color.parse("#E7C856"), $.color.parse("#CD462E"), $.color.parse("#B01732"), $.color.parse("#41192A")];
//var colors = [$.color.parse("#434F5E"), $.color.parse("#BEF731"), $.color.parse("#FB5455"), $.color.parse("#44C4B7")]; //var colors = [$.color.parse("#434F5E"), $.color.parse("#BEF731"), $.color.parse("#FB5455"), $.color.parse("#44C4B7")];
...@@ -58,7 +61,7 @@ $(function () { ...@@ -58,7 +61,7 @@ $(function () {
color: colors[${sectionIndex}].toString(), color: colors[${sectionIndex}].toString(),
}); });
ticks = ticks.concat( [ [${tickIndex}, "${section['totallabel']}"] ] ); ticks = ticks.concat( [ [${tickIndex}, "${section['totallabel']}"] ] );
detail_tooltips["${section['category']} Average"] = [ "${section['totalscore']['summary']}" ]; detail_tooltips["${section['category']} Total"] = [ "${section['totalscore']['summary']}" ];
<% tickIndex += 1 + sectionSpacer %> <% tickIndex += 1 + sectionSpacer %>
%else: ##This is for sections like midterm or final, which have no smaller components %else: ##This is for sections like midterm or final, which have no smaller components
...@@ -76,7 +79,7 @@ $(function () { ...@@ -76,7 +79,7 @@ $(function () {
%endfor %endfor
//Alwasy be sure that one series has the xaxis set to 2, or the second xaxis labels won't show up //Alwasy be sure that one series has the xaxis set to 2, or the second xaxis labels won't show up
series.push( {label: 'Dropped Scores', data: droppedScores, points: {symbol: "cross", show: true, radius: 3}, bars: {show: false}, color: "red"} ); series.push( {label: 'Dropped Scores', data: droppedScores, points: {symbol: "cross", show: true, radius: 3}, bars: {show: false}, color: "#333"} );
/* ----------------------------- Grade overviewew bar -------------------------*/ /* ----------------------------- Grade overviewew bar -------------------------*/
...@@ -113,12 +116,12 @@ $(function () { ...@@ -113,12 +116,12 @@ $(function () {
var options = { var options = {
series: {stack: true, series: {stack: true,
lines: {show: false, steps: false }, lines: {show: false, steps: false },
bars: {show: true, barWidth: 0.6, align: 'center', lineWidth: 1},}, bars: {show: true, barWidth: 0.8, align: 'center', lineWidth: 0, fill: .8 },},
xaxis: {tickLength: 0, min: 0.0, max: ${tickIndex - sectionSpacer}, ticks: ticks, labelAngle: 90}, xaxis: {tickLength: 0, min: 0.0, max: ${tickIndex - sectionSpacer}, ticks: ticks, labelAngle: 90},
yaxis: {ticks: [[1, "100%"], [0.87, "A 87%"], [0.7, "B 70%"], [0.6, "C 60%"], [0, "0%"]], min: 0.0, max: 1.0, labelWidth: 50}, yaxis: {ticks: [[1, "100%"], [0.87, "A 87%"], [0.7, "B 70%"], [0.6, "C 60%"], [0, "0%"]], min: 0.0, max: 1.0, labelWidth: 50},
grid: { hoverable: true, clickable: true, borderWidth: 1, grid: { hoverable: true, clickable: true, borderWidth: 1,
markings: [ {yaxis: {from: 0.87, to: 1 }, color: "#EBFFD5"}, {yaxis: {from: 0.7, to: 0.87 }, color: "#E6FFFF"}, markings: [ {yaxis: {from: 0.87, to: 1 }, color: "#ddd"}, {yaxis: {from: 0.7, to: 0.87 }, color: "#e9e9e9"},
{yaxis: {from: 0.6, to: 0.7 }, color: "#FFF2E3"}, ] }, {yaxis: {from: 0.6, to: 0.7 }, color: "#f3f3f3"}, ] },
legend: {show: false}, legend: {show: false},
}; };
......
...@@ -27,10 +27,16 @@ div.info-wrapper { ...@@ -27,10 +27,16 @@ div.info-wrapper {
margin: 0 flex-gutter() 0 0; margin: 0 flex-gutter() 0 0;
} }
p { section.update-description {
float: left; float: left;
width: flex-grid(7, 9); width: flex-grid(7, 9);
margin-bottom: 0; margin-bottom: 0;
p {
&:last-child {
margin-bottom: 0;
}
}
} }
} }
} }
...@@ -43,8 +49,10 @@ div.info-wrapper { ...@@ -43,8 +49,10 @@ div.info-wrapper {
border-left: 1px solid #d3d3d3; border-left: 1px solid #d3d3d3;
h1 { h1 {
padding: 0 lh(); padding: lh(.5) lh();
font-size: 18px; font-size: 18px;
margin: 0 ;
@extend .bottom-border;
} }
ol { ol {
......
...@@ -4,13 +4,15 @@ div.profile-wrapper { ...@@ -4,13 +4,15 @@ div.profile-wrapper {
section.user-info { section.user-info {
@extend .sidebar; @extend .sidebar;
@include border-radius(0px 4px 0px 4px); @include border-radius(0px 4px 4px 0);
border-left: 1px solid #d3d3d3; border-left: 1px solid #d3d3d3;
border-right: 0; border-right: 0;
h1 { h1 {
padding:0 lh(); padding: lh(.5) lh();
font-size: 18px; font-size: 18px;
margin: 0 ;
@extend .bottom-border;
} }
ul { ul {
...@@ -57,32 +59,41 @@ div.profile-wrapper { ...@@ -57,32 +59,41 @@ div.profile-wrapper {
@extend .top-header; @extend .top-header;
} }
div#grade-detail-graph {
width: 100%;
min-height: 300px;
}
> ol { > ol {
list-style: none;
border-top: 1px solid #e3e3e3; border-top: 1px solid #e3e3e3;
list-style: none;
margin-top: lh(); margin-top: lh();
> li { > li {
@extend .clearfix;
border-bottom: 1px solid #e3e3e3; border-bottom: 1px solid #e3e3e3;
display: table;
padding: lh() 0; padding: lh() 0;
width: 100%; width: 100%;
display: table;
@extend .clearfix; &:last-child {
border-bottom: 0px;
}
h2 { h2 {
border-right: 1px dashed #ddd;
@include box-sizing(border-box);
display: table-cell; display: table-cell;
padding: 0;
margin: 0; margin: 0;
width: flex-grid(2, 9); padding: 0;
padding-right: flex-gutter(9); padding-right: flex-gutter(9);
border-right: 1px dotted #ccc; width: flex-grid(2, 9);
@include box-sizing(border-box);
} }
ol.sections { ol.sections {
padding-left: flex-gutter(9);
display: table-cell; display: table-cell;
list-style: none; list-style: none;
padding-left: flex-gutter(9);
width: flex-grid(7, 9); width: flex-grid(7, 9);
> li { > li {
...@@ -112,6 +123,5 @@ div.profile-wrapper { ...@@ -112,6 +123,5 @@ div.profile-wrapper {
} }
} }
} }
} }
} }
div.book-wrapper { div.book-wrapper {
@extend .table-wrapper; @extend .table-wrapper;
ul#booknav { section.book-sidebar {
@extend .sidebar; @extend .sidebar;
@include box-sizing(border-box); @include box-sizing(border-box);
@extend .tran;
a { ul#booknav {
color: #000;
&:hover { a {
color: #666; color: #000;
}
}
li {
background: none;
padding-left: 30px;
div.hitarea {
margin-left: -22px;
background-image: url('/static/images/treeview-default.gif');
position: relative;
top: 4px;
&:hover { &:hover {
opacity: 0.6; color: #666;
filter: alpha(opacity=60);
} }
} }
ul { li {
background: none; background: none;
padding-left: 30px;
div.hitarea {
margin-left: -22px;
background-image: url('/static/images/treeview-default.gif');
position: relative;
top: 4px;
&:hover {
opacity: 0.6;
filter: alpha(opacity=60);
}
}
ul {
background: none;
}
} }
}
> li { > li {
border-bottom: 1px solid #d3d3d3; border-bottom: 1px solid #d3d3d3;
@include box-shadow(0 1px 0 #eee); @include box-shadow(0 1px 0 #eee);
padding: 7px 7px 7px 30px; padding: 7px 7px 7px 30px;
}
} }
} }
...@@ -50,7 +54,7 @@ div.book-wrapper { ...@@ -50,7 +54,7 @@ div.book-wrapper {
a { a {
@extend .block-link; @extend .block-link;
padding: 14px; padding: 0 lh();
} }
ul { ul {
...@@ -92,4 +96,36 @@ div.book-wrapper { ...@@ -92,4 +96,36 @@ div.book-wrapper {
} }
} }
} }
&.closed {
section.book-sidebar {
width: flex-grid(.6);
header#open_close_accordion {
padding: 0;
a {
background-image: url('/static/images/slide-right-icon.png');
}
h2 {
visibility: hidden;
width: 10px;
padding: 0;
}
}
ul#booknav {
visibility: hidden;
width: 10px;
padding: 0;
overflow: hidden;
max-height: 100px;
}
}
section.course-content {
width: flex-grid(11.5) + flex-gutter();
}
}
} }
...@@ -4,14 +4,14 @@ ...@@ -4,14 +4,14 @@
@import "base/reset", "base/font-face"; @import "base/reset", "base/font-face";
@import "base/variables", "base/functions", "base/extends", "base/base"; @import "base/variables", "base/functions", "base/extends", "base/base";
@import "layout/layout", "layout/header", "layout/footer", "layout/leanmodal"; @import "layout/layout", "layout/header", "layout/footer", "layout/leanmodal";
@import "jquery-ui-1.8.16.custom"; @import "plugins/jquery-ui-1.8.16.custom";
// pages // pages
@import "courseware/courseware", "courseware/sidebar", "courseware/video", "courseware/sequence-nav"; @import "courseware/courseware", "courseware/sidebar", "courseware/video", "courseware/sequence-nav", "courseware/amplifier";
@import "textbook"; @import "textbook";
@import "info"; @import "info";
@import "profile"; @import "profile";
@import "wiki/basic-html", "wiki/sidebar", "wiki/create", "wiki/wiki"; @import "wiki/basic-html", "wiki/sidebar", "wiki/create", "wiki/wiki", "wiki/table";
@import "help"; @import "help";
@import "discussion/askbot-original", "discussion/discussion","discussion/sidebar", "discussion/questions", "discussion/tags", "discussion/question-view" , "discussion/answers", "discussion/forms", "discussion/form-wmd-toolbar", "discussion/modals", "discussion/profile"; @import "discussion/askbot-original", "discussion/discussion","discussion/sidebar", "discussion/questions", "discussion/tags", "discussion/question-view" , "discussion/answers", "discussion/forms", "discussion/form-wmd-toolbar", "discussion/modals", "discussion/profile", "discussion/badges";
...@@ -10,8 +10,8 @@ ...@@ -10,8 +10,8 @@
margin: 0 auto; margin: 0 auto;
max-width: $fg-max-width; max-width: $fg-max-width;
min-width: $fg-min-width; min-width: $fg-min-width;
width: flex-grid(12);
text-align: left; text-align: left;
width: flex-grid(12);
div.table-wrapper { div.table-wrapper {
display: table; display: table;
...@@ -20,24 +20,24 @@ ...@@ -20,24 +20,24 @@
} }
h1.top-header { h1.top-header {
margin: (-(lh())) (-(lh())) lh();
padding: lh();
background: #f3f3f3; background: #f3f3f3;
border-bottom: 1px solid #e3e3e3; border-bottom: 1px solid #e3e3e3;
margin: (-(lh())) (-(lh())) lh();
padding: lh();
} }
.button { .button {
@include box-shadow(inset 0 1px 0 lighten(#888, 10%), 0 0 3px #ccc);
@include linear-gradient(lighten(#888, 5%), darken(#888, 5%));
@include border-radius(3px);
border: 1px solid darken(#888, 10%); border: 1px solid darken(#888, 10%);
padding: 4px 8px; @include border-radius(3px);
@include box-shadow(inset 0 1px 0 lighten(#888, 10%), 0 0 3px #ccc);
color: #fff; color: #fff;
font: bold $body-font-size $body-font-family;
cursor: pointer; cursor: pointer;
-webkit-font-smoothing: antialiased; font: bold $body-font-size $body-font-family;
text-shadow: none; @include linear-gradient(lighten(#888, 5%), darken(#888, 5%));
padding: 4px 8px;
text-decoration: none; text-decoration: none;
text-shadow: none;
-webkit-font-smoothing: antialiased;
&:hover, &:focus { &:hover, &:focus {
@include box-shadow(inset 0 1px 0 lighten(#888, 20%), 0 0 3px #ccc); @include box-shadow(inset 0 1px 0 lighten(#888, 20%), 0 0 3px #ccc);
...@@ -47,48 +47,68 @@ h1.top-header { ...@@ -47,48 +47,68 @@ h1.top-header {
} }
.content { .content {
@include box-sizing(border-box);
@include box-shadow(inset 0 0 2px 3px #f3f3f3); @include box-shadow(inset 0 0 2px 3px #f3f3f3);
@include box-sizing(border-box);
display: table-cell; display: table-cell;
padding: lh(); padding: lh();
vertical-align: top; vertical-align: top;
width: flex-grid(9) + flex-gutter(); width: flex-grid(9) + flex-gutter();
@media print {
@include box-shadow(none);
}
} }
.sidebar { .sidebar {
@include box-shadow( inset 0 0 0 1px #f6f6f6);
@include box-sizing(border-box);
@include border-radius(4px 0 0 4px);
background: #e3e3e3; background: #e3e3e3;
@include border-radius(4px 0 0 4px);
border-right: 1px solid #d3d3d3; border-right: 1px solid #d3d3d3;
@include box-shadow( inset 0 0 0 1px #f6f6f6);
@include box-sizing(border-box);
display: table-cell; display: table-cell;
font-family: $body-font-family; font-family: $body-font-family;
position: relative;
text-shadow: 0 1px 0 #f1f1f1; text-shadow: 0 1px 0 #f1f1f1;
vertical-align: top; vertical-align: top;
width: flex-grid(3); width: flex-grid(3);
position: relative;
h3 { h1, h2 {
font-size: 18px;
font-weight: 800;
letter-spacing: 0;
text-transform: none;
}
.bottom-border {
@include box-shadow(0 1px 0 #eee); @include box-shadow(0 1px 0 #eee);
background: none; border-bottom: 1px solid #d3d3d3;
}
@media print {
display: none;
}
h3 {
border: none; border: none;
border-bottom: 1px solid #d3d3d3; border-bottom: 1px solid #d3d3d3;
@extend .bottom-border;
background: none;
color: #000; color: #000;
font-weight: normal; font-weight: normal;
margin: 0; margin: 0;
overflow: hidden; overflow: hidden;
a { a {
@include transition();
color: lighten($text-color, 10%); color: lighten($text-color, 10%);
display: block; display: block;
font-size: $body-font-size; font-size: $body-font-size;
padding: 7px 7px 7px 30px; padding: 7px 7px 7px 30px;
text-decoration: none; text-decoration: none;
@include transition();
&:hover { &:hover {
@include box-shadow(0 1px 0 #fff);
background: #efefef; background: #efefef;
@include box-shadow(0 1px 0 #fff);
} }
} }
...@@ -97,10 +117,10 @@ h1.top-header { ...@@ -97,10 +117,10 @@ h1.top-header {
} }
&.active { &.active {
@include box-shadow(none);
background: none; background: none;
border: 0; border: 0;
border-bottom: 1px solid #bbb; border-bottom: 1px solid #bbb;
@include box-shadow(none);
color: #000; color: #000;
font-weight: bold; font-weight: bold;
...@@ -110,19 +130,54 @@ h1.top-header { ...@@ -110,19 +130,54 @@ h1.top-header {
} }
} }
header#open_close_accordion {
border-bottom: 1px solid #d3d3d3;
@include box-shadow(0 1px 0 #eee);
padding: lh(.5) lh();
position: relative;
h2 {
padding-right: 20px;
margin: 0;
}
a {
background: #eee url('/static/images/slide-left-icon.png') center center no-repeat;
border: 1px solid #D3D3D3;
@include border-radius(3px 0 0 3px);
height: 16px;
padding: 8px;
position: absolute;
right: -1px;
text-indent: -9999px;
top: 6px;
width: 16px;
&:hover {
background-color: white;
}
}
}
a.button { a.button {
text-decoration: none; text-decoration: none;
} }
} }
.topbar { .topbar {
@extend .clearfix;
background: #F6EFD4; background: #F6EFD4;
border-bottom: 1px solid darken(#F6EFD4, 10%); border-bottom: 1px solid darken(#F6EFD4, 10%);
margin: (-$body-line-height) (-$body-line-height) $body-line-height; @include box-shadow(inset 0 1px 0 #fff, inset 1px 0 0 #fff);
font-size: 12px; font-size: 12px;
margin: (-$body-line-height) (-$body-line-height) $body-line-height;
text-shadow: 0 1px 0 #fff; text-shadow: 0 1px 0 #fff;
@include box-shadow(inset 0 1px 0 #fff, inset 1px 0 0 #fff); line-height: 46px;
@extend .clearfix; height:46px;
@media print {
display: none;
}
a { a {
color: darken(#F6EFD4, 80%); color: darken(#F6EFD4, 80%);
...@@ -133,12 +188,11 @@ h1.top-header { ...@@ -133,12 +188,11 @@ h1.top-header {
} }
&.block-link { &.block-link {
@include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
background: darken(#F6EFD4, 5%); background: darken(#F6EFD4, 5%);
border-left: 1px solid darken(#f6efd4, 20%); border-left: 1px solid darken(#f6efd4, 20%);
padding: lh(.75); @include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
text-transform: uppercase;
display: block; display: block;
text-transform: uppercase;
&:hover { &:hover {
background: none; background: none;
...@@ -146,3 +200,16 @@ h1.top-header { ...@@ -146,3 +200,16 @@ h1.top-header {
} }
} }
} }
.tran {
@include transition( all, .2s, $ease-in-out-quad);
}
p.ie-warning {
display: block !important;
line-height: 1.3em;
background: yellow;
padding: lh();
text-align: left;
margin-bottom: 0;
}
...@@ -10,7 +10,7 @@ html, body, div, span, object, iframe, ...@@ -10,7 +10,7 @@ html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, small, strong, var,
b, i, b, i,
dl, dt, dd, ol, ul, li, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, fieldset, form, label, legend,
......
// JM MOSFET AMPLIFIER
div#graph-container {
@extend .clearfix;
border-top: 1px solid #ddd;
padding-top: lh(1.0);
canvas#graph {
width: flex-grid(4.5, 9);
float: left;
margin-right: flex-gutter(9);
}
div.graph-controls {
width: flex-grid(4.5, 9);
float: left;
select#musicTypeSelect {
display: block;
margin-bottom: lh(2);
}
div#graph-output {
display: block;
margin-bottom: lh(2);
}
div#graph-listen {
display: block;
margin-bottom: lh(2);
}
p {
margin-bottom: lh(1);
}
div#label {
display: inline-block;
}
input#playButton {
display: block;
}
}
}
div#schematic-container {
@extend .clearfix;
canvas {
width: flex-grid(4.5, 9);
float: left;
margin-right: flex-gutter(9);
}
div.schematic-sliders {
width: flex-grid(4.5, 9);
float: left;
div.slider-label#vs {
margin-top: lh(2.0);
}
div.slider-label {
margin-bottom: lh(0.5);
}
div.slider {
margin-bottom: lh(1);
}
}
}
//End JM MOSFET AMPLIFIER
// Labels
div.graph-controls, div#graph-listen {
label {
@include border-radius(2px);
font-weight: bold;
padding: 3px;
}
label[for="vinCheckbox"], label[for="vinRadioButton"]{
color: desaturate(#00bfff, 50%);
}
label[for="voutCheckbox"], label[for="voutRadioButton"]{
color: darken(#ffcf48, 20%);
}
label[for="vrCheckbox"], label[for="vrRadioButton"]{
color: desaturate(#1df914, 40%);
}
}
...@@ -5,10 +5,6 @@ div.course-wrapper { ...@@ -5,10 +5,6 @@ div.course-wrapper {
list-style: none; list-style: none;
} }
.tran {
@include transition( all, .2s, $ease-in-out-quad);
}
section.course-content { section.course-content {
@extend .content; @extend .content;
...@@ -40,7 +36,7 @@ div.course-wrapper { ...@@ -40,7 +36,7 @@ div.course-wrapper {
margin-bottom: 15px; margin-bottom: 15px;
width: flex-grid(2, 9); width: flex-grid(2, 9);
padding-right: flex-gutter(9); padding-right: flex-gutter(9);
border-right: 1px dotted #ccc; border-right: 1px dashed #ddd;
@include box-sizing(border-box); @include box-sizing(border-box);
display: table-cell; display: table-cell;
vertical-align: top; vertical-align: top;
...@@ -50,6 +46,12 @@ div.course-wrapper { ...@@ -50,6 +46,12 @@ div.course-wrapper {
width: auto; width: auto;
border-right: 0; border-right: 0;
} }
@media print {
display: block;
width: auto;
border-right: 0;
}
} }
section.problem { section.problem {
...@@ -63,6 +65,16 @@ div.course-wrapper { ...@@ -63,6 +65,16 @@ div.course-wrapper {
padding: 0; padding: 0;
} }
@media print {
display: block;
width: auto;
padding: 0;
canvas, img {
page-break-inside: avoid;
}
}
span { span {
&.unanswered, &.ui-icon-bullet { &.unanswered, &.ui-icon-bullet {
@include inline-block(); @include inline-block();
...@@ -133,7 +145,7 @@ div.course-wrapper { ...@@ -133,7 +145,7 @@ div.course-wrapper {
div#seq_content { div#seq_content {
h1 { h1 {
background: none; background: none;
margin-bottom: 0; margin-bottom: lh();
padding-bottom: 0; padding-bottom: 0;
border-bottom: none; border-bottom: none;
} }
...@@ -160,7 +172,7 @@ div.course-wrapper { ...@@ -160,7 +172,7 @@ div.course-wrapper {
section.course-index { section.course-index {
width: flex-grid(.6); width: flex-grid(.6);
div#open_close_accordion { header#open_close_accordion {
padding: 0; padding: 0;
a { a {
......
...@@ -6,102 +6,151 @@ nav.sequence-nav { ...@@ -6,102 +6,151 @@ nav.sequence-nav {
display: table-row; display: table-row;
float: left; float: left;
width: flex-grid(7.5,9) + flex-gutter(); width: flex-grid(7.5,9) + flex-gutter();
position: relative;
a { a {
@extend .block-link; @extend .block-link;
} }
.inactive { li {
background-repeat: no-repeat; display: table-cell;
.inactive {
background-repeat: no-repeat;
&:hover { &:hover {
background-color: lighten(#F6EFD4, 3%); background-color: lighten(#F6EFD4, 3%);
}
} }
}
.visited { .visited {
background-color: shade(#F6EFD4, 10%); background-color: #DCCDA2;
background-repeat: no-repeat; background-repeat: no-repeat;
border-color: shade(#F6EFD4, 10%); @include box-shadow(inset 0 0 3px darken(#dccda2, 10%));
&:hover { &:hover {
background-color: #F6EFD4; background-color: #F6EFD4;
background-position: center center;
}
} }
}
.active { .active {
// @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%), inset 1px 0 0 darken(#F6EFD4, 20%)); // @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%), inset 1px 0 0 darken(#F6EFD4, 20%));
@include box-shadow(0 1px 0 #fff); @include box-shadow(0 1px 0 #fff);
background-color: #fff;
background-repeat: no-repeat;
&:hover {
background-color: #fff; background-color: #fff;
background-repeat: no-repeat;
&:hover {
background-color: #fff;
background-position: center;
}
} }
}
li { a {
@include box-shadow(1px 0 0 #fff); @include box-shadow(1px 0 0 #fff);
background-position: center center; background-position: center center;
border: none; border: none;
border-right: 1px solid darken(#F6EFD4, 10%); border-right: 1px solid darken(#F6EFD4, 10%);
cursor: pointer; cursor: pointer;
display: table-cell; padding: 15px 4px 14px;
padding: 14px 4px; width: 28px;
width: 28px; height: 17px;
// @media screen and (max-width: 800px) {
// padding: 12px 8px;
// }
//video
&.seq_video_inactive {
@extend .inactive;
background-image: url('/static/images/sequence-nav/video-icon-normal.png');
background-position: center;
}
// @media screen and (max-width: 800px) { &.seq_video_visited {
// padding: 12px 8px; @extend .visited;
// } background-image: url('/static/images/sequence-nav/video-icon-visited.png');
background-position: center;
}
//video &.seq_video_active {
&.seq_video_inactive { @extend .active;
@extend .inactive; background-image: url('/static/images/sequence-nav/video-icon-current.png');
background-image: url('/static/images/sequence-nav/video-icon-normal.png'); background-position: center;
} }
&.seq_video_visited { //other
@extend .visited; &.seq_other_inactive {
background-image: url('/static/images/sequence-nav/video-icon-visited.png'); @extend .inactive;
} background-image: url('/static/images/sequence-nav/document-icon-normal.png');
background-position: center;
}
&.seq_video_active { &.seq_other_visited {
@extend .active; @extend .visited;
background-image: url('/static/images/sequence-nav/video-icon-current.png'); background-image: url('/static/images/sequence-nav/document-icon-visited.png');
} background-position: center;
}
//other &.seq_other_active {
&.seq_other_inactive { @extend .active;
@extend .inactive; background-image: url('/static/images/sequence-nav/document-icon-current.png');
background-image: url('/static/images/sequence-nav/document-icon-normal.png'); background-position: center;
} }
&.seq_other_visited { //vertical & problems
@extend .visited; &.seq_vertical_inactive, &.seq_problem_inactive {
background-image: url('/static/images/sequence-nav/document-icon-visited.png'); @extend .inactive;
} background-image: url('/static/images/sequence-nav/list-icon-normal.png');
background-position: center;
}
&.seq_other_active { &.seq_vertical_visited, &.seq_problem_visited {
@extend .active; @extend .visited;
background-image: url('/static/images/sequence-nav/document-icon-current.png'); background-image: url('/static/images/sequence-nav/list-icon-visited.png');
} background-position: center;
}
//vertical & problems &.seq_vertical_active, &.seq_problem_active {
&.seq_vertical_inactive, &.seq_problem_inactive { @extend .active;
@extend .inactive; background-image: url('/static/images/sequence-nav/list-icon-current.png');
background-image: url('/static/images/sequence-nav/list-icon-normal.png'); background-position: center;
} }
}
&.seq_vertical_visited, &.seq_problem_visited { p {
@extend .visited; position: absolute;
background-image: url('/static/images/sequence-nav/list-icon-visited.png'); display: none;
} background: #333;
padding: 6px;
white-space: pre-wrap;
z-index: 99;
margin: 4px 0 0 -5px;
text-shadow: 0 -1px 0 #000;
color: #fff;
line-height: lh();
&:empty {
background: none;
&::after {
display: none;
}
}
&.seq_vertical_active, &.seq_problem_active { &::after {
@extend .active; background: #333;
background-image: url('/static/images/sequence-nav/list-icon-current.png'); content: " ";
display: block;
height: 10px;
position: absolute;
top: -5px;
left: 18px;
@include transform(rotate(45deg));
@include transition();
width: 10px;
}
} }
} }
} }
...@@ -124,7 +173,7 @@ nav.sequence-nav { ...@@ -124,7 +173,7 @@ nav.sequence-nav {
border-left: 1px solid darken(#f6efd4, 20%); border-left: 1px solid darken(#f6efd4, 20%);
cursor: pointer; cursor: pointer;
display: table-cell; display: table-cell;
padding: 14px 4px; padding: 0 4px;
text-indent: -9999px; text-indent: -9999px;
width: 82px; width: 82px;
......
...@@ -2,34 +2,6 @@ section.course-index { ...@@ -2,34 +2,6 @@ section.course-index {
@extend .sidebar; @extend .sidebar;
@extend .tran; @extend .tran;
div#open_close_accordion {
@include box-shadow(0 1px 0 #eee);
border-bottom: 1px solid #d3d3d3;
padding: 0 lh();
position: relative;
h2 {
padding-right: 20px;
}
a {
width: 16px;
text-indent: -9999px;
height: 16px;
position: absolute;
padding: 8px;
top: -12px;
right: -1px;
border: 1px solid #D3D3D3;
background: #eee url('/static/images/slide-left-icon.png') center center no-repeat;
@include border-radius(3px 0 0 3px);
&:hover {
background-color: white;
}
}
}
div#accordion { div#accordion {
h3 { h3 {
......
section.course-content { section.course-content {
div.video-subtitles {
position: relative;
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%;
}
div.video-wrapper { iframe#html5_player {
float: left; border: none;
width: flex-grid(6, 9); display: none;
margin-right: flex-gutter(9); position: absolute;
top: 0;
div.video-player { left: 0;
position: relative; width: 100%;
padding-bottom: 56.25%; height: 100%;
padding-top: 30px; }
height: 0;
overflow: hidden;
object {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
} }
iframe#html5_player { // ul {
border: none; // float: left;
display: none;
position: absolute; // li {
top: 0; // margin-top: 5px;
left: 0; // display: inline-block;
width: 100%; // cursor: pointer;
height: 100%; // border: 0;
} // padding: 0;
}
// div {
// ul { // &:empty {
// float: left; // display: none;
// }
// li { // }
// margin-top: 5px; // }
// display: inline-block; // }
// cursor: pointer;
// border: 0; section.video-controls {
// padding: 0;
// div {
// &:empty {
// display: none;
// }
// }
// }
// }
section.video-controls {
@extend .clearfix;
background: #333;
border: 1px solid #000;
color: #ccc;
div#slider {
@extend .clearfix; @extend .clearfix;
@include border-radius(0); background: #333;
@include box-shadow(inset 0 1px 0 #eee, 0 1px 0 #555); position: relative;
background: #c2c2c2; border: 1px solid #000;
border: none; color: #ccc;
border-bottom: 1px solid #000;
height: 14px; div#slider {
@extend .clearfix;
a.ui-slider-handle { @include border-radius(0);
@include border-radius(20px); @include box-shadow(inset 0 1px 0 #eee, 0 1px 0 #555);
@include box-shadow(inset 0 1px 0 lighten($mit-red, 10%)); background: #c2c2c2;
background: $mit-red url(/static/images/slider-handle.png) center center no-repeat; border: none;
border: 0; border-bottom: 1px solid #000;
border: 1px solid darken($mit-red, 20%); height: 14px;
cursor: pointer;
height: 20px; a.ui-slider-handle {
margin-left: -10px; @include border-radius(20px);
top: -4px; @include box-shadow(inset 0 1px 0 lighten($mit-red, 10%));
width: 20px; background: $mit-red url(/static/images/slider-handle.png) center center no-repeat;
border: 0;
&:focus { border: 1px solid darken($mit-red, 20%);
outline: none; cursor: pointer;
height: 20px;
margin-left: -10px;
top: -4px;
width: 20px;
&:focus {
outline: none;
}
} }
} }
}
ul.vcr {
float: left;
margin-right: lh();
li { ul.vcr {
float: left; float: left;
margin-bottom: 0; margin-right: lh();
a { li {
@include box-shadow(1px 0 0 #555); float: left;
border-right: 1px solid #000; margin-bottom: 0;
display: block;
cursor: pointer;
height: 14px;
padding: lh(.75) lh();
text-indent: -9999px;
width: 14px;
&.play {
background: url('/static/images/play-icon.png') center center no-repeat;
&:hover { a {
background-color: #444; @include box-shadow(1px 0 0 #555);
border-right: 1px solid #000;
display: block;
cursor: pointer;
height: 14px;
padding: lh(.75) lh();
text-indent: -9999px;
width: 14px;
&.play {
background: url('/static/images/play-icon.png') center center no-repeat;
&:hover {
background-color: #444;
}
} }
}
&.pause { &.pause {
background: url('/static/images/pause-icon.png') center center no-repeat; background: url('/static/images/pause-icon.png') center center no-repeat;
&:hover { &:hover {
background-color: #444; background-color: #444;
}
} }
}
div#vidtime {
padding-left: lh();
font-weight: bold;
line-height: 46px; //height of play pause buttons
-webkit-font-smoothing: antialiased;
} }
} }
} }
}
div#vidtime { div.secondary-controls {
float: left; float: right;
font-weight: bold;
line-height: 46px; //height of play pause buttons
-webkit-font-smoothing: antialiased;
}
div.speeds { div.speeds {
float: right; border-right: 1px solid #000;
line-height: 46px; //height of play pause buttons border-left: 1px solid #000;
margin-right: lh(); @include box-shadow(1px 0 0 #555, inset 1px 0 0 #555);
-webkit-font-smoothing: antialiased; float: left;
line-height: 46px; //height of play pause buttons
margin-right: 0;
-webkit-font-smoothing: antialiased;
h3 {
@include inline-block();
a {
color: #fff;
padding: 0 lh(.5);
@include inline-block();
&:hover {
text-decoration: none;
// background-color: #444;
}
}
}
div#video_speeds { // fix for now
@include inline-block(); ol#video_speeds {
font-weight: bold; @include inline-block();
padding-right: lh(.5);
span { li {
@include inline-block(); cursor: pointer;
cursor: pointer; @include inline-block();
margin-bottom: 0; }
}
}
a.hide-subtitles {
float: left;
display: block;
padding-right: lh(.5);
margin-left: 0;
color: #797979;
padding-left: 50px;
line-height: 46px; //height of play pause buttons
font-weight: 800;
background: url('/static/images/cc.png') 16px center no-repeat;
-webkit-font-smoothing: antialiased;
&:hover { &:hover {
color: $mit-red; color: #fff;
text-decoration: none;
background-color: #444;
} }
} }
} }
} }
} }
}
ol.subtitles { ol.subtitles {
float: left; float: left;
width: flex-grid(3, 9); width: flex-grid(3, 9);
height: 530px; height: 530px;
overflow: hidden; overflow: hidden;
li {
margin-bottom: 0px;
cursor: pointer;
border: 0;
padding: 0;
color: #666;
&.current {
background-color: #f3f3f3;
color: #333;
}
&:hover { li {
color: $mit-red; 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;
}
} }
}
div { &.closed {
margin-bottom: 8px; @extend .trans;
div.video-wrapper {
width: flex-grid(9,9);
} }
div:empty { ol.subtitles {
margin-bottom: 0px; width: 0px;
height: 0;
} }
} }
} }
} }
...@@ -74,11 +74,21 @@ div.answer-block { ...@@ -74,11 +74,21 @@ div.answer-block {
} }
} }
div.accepted-answer {
p {
color:#000;
}
}
div.deleted { div.deleted {
p { p {
color: $mit-red; color: $mit-red;
} }
} }
img.answer-img-accept {
opacity: 0.7;
}
} }
div.paginator { div.paginator {
...@@ -141,3 +151,4 @@ div.answer-actions { ...@@ -141,3 +151,4 @@ div.answer-actions {
} }
} }
...@@ -1165,13 +1165,13 @@ body.anon #searchbar { ...@@ -1165,13 +1165,13 @@ body.anon #searchbar {
font-weight: normal; font-weight: normal;
cursor: help; } cursor: help; }
.question-options { // .question-options {
margin-top: 1px; // margin-top: 1px;
color: #666; // color: #666;
line-height: 13px; // line-height: 13px;
margin-bottom: 5px; // margin-bottom: 5px;
label { // label {
vertical-align: text-bottom; } } // vertical-align: text-bottom; } }
// .edit-content-html { // .edit-content-html {
// border-top: 1px dotted #d8d2a9; // border-top: 1px dotted #d8d2a9;
...@@ -1652,73 +1652,73 @@ body.anon #searchbar { ...@@ -1652,73 +1652,73 @@ body.anon #searchbar {
// padding: 5px; // padding: 5px;
// margin: 0px 0 10px 0; } } // margin: 0px 0 10px 0; } }
@media screen and (-webkit-min-device-pixel-ratio:0) { // @media screen and (-webkit-min-device-pixel-ratio:0) {
textarea { // textarea {
padding-left: 3px !important; } } // padding-left: 3px !important; } }
.facebook-share.icon, .twitter-share.icon, .linkedin-share.icon, .identica-share.icon { // .facebook-share.icon, .twitter-share.icon, .linkedin-share.icon, .identica-share.icon {
background: url(../images/socialsprite.png) no-repeat; // background: url(../images/socialsprite.png) no-repeat;
display: block; // display: block;
text-indent: -100em; // text-indent: -100em;
height: 25px; // height: 25px;
width: 25px; // width: 25px;
margin-bottom: 3px; } // margin-bottom: 3px; }
.facebook-share.icon:hover, .twitter-share.icon:hover, .linkedin-share.icon:hover, .identica-share.icon:hover { // .facebook-share.icon:hover, .twitter-share.icon:hover, .linkedin-share.icon:hover, .identica-share.icon:hover {
opacity: 0.8; // opacity: 0.8;
filter: alpha(opacity = 80); } // filter: alpha(opacity = 80); }
.facebook-share.icon { // .facebook-share.icon {
background-position: -26px 0px; } // background-position: -26px 0px; }
.identica-share.icon { // .identica-share.icon {
background-position: -78px 0px; } // background-position: -78px 0px; }
.twitter-share.icon { // .twitter-share.icon {
margin-top: 10px; // margin-top: 10px;
background-position: 0px 0px; } // background-position: 0px 0px; }
.linkedin-share.icon { // .linkedin-share.icon {
background-position: -52px 0px; } // background-position: -52px 0px; }
.openid-signin, .meta, .users-page, .user-profile-edit-page { // .openid-signin, .meta, .users-page, .user-profile-edit-page {
font-size: 13px; // font-size: 13px;
line-height: 1.3; // line-height: 1.3;
color: #525252; } // color: #525252; }
.openid-signin p, .meta p, .users-page p, .user-profile-edit-page p { // .openid-signin p, .meta p, .users-page p, .user-profile-edit-page p {
font-size: 13px; // font-size: 13px;
color: #707070; // color: #707070;
line-height: 1.3; // line-height: 1.3;
font-family: arial; // font-family: arial;
color: #525252; // color: #525252;
margin-bottom: 12px; } // margin-bottom: 12px; }
.openid-signin h2, .meta h2, .users-page h2, .user-profile-edit-page h2 { // .openid-signin h2, .meta h2, .users-page h2, .user-profile-edit-page h2 {
color: #525252; // color: #525252;
padding-left: 0px; // padding-left: 0px;
font-size: 16px; } // font-size: 16px; }
.openid-signin form, .meta form, .users-page form, .user-profile-edit-page form, .user-profile-page form { // .openid-signin form, .meta form, .users-page form, .user-profile-edit-page form, .user-profile-page form {
margin-bottom: 15px; } // margin-bottom: 15px; }
.openid-signin input[type="text"], .meta input[type="text"], .users-page input[type="text"], .user-profile-edit-page input[type="text"], .user-profile-page input[type="text"], .openid-signin input[type="password"], .meta input[type="password"], .users-page input[type="password"], .user-profile-edit-page input[type="password"], .user-profile-page input[type="password"], .openid-signin select, .meta select, .users-page select, .user-profile-edit-page select, .user-profile-page select { // .openid-signin input[type="text"], .meta input[type="text"], .users-page input[type="text"], .user-profile-edit-page input[type="text"], .user-profile-page input[type="text"], .openid-signin input[type="password"], .meta input[type="password"], .users-page input[type="password"], .user-profile-edit-page input[type="password"], .user-profile-page input[type="password"], .openid-signin select, .meta select, .users-page select, .user-profile-edit-page select, .user-profile-page select {
border: #cce6ec 3px solid; // border: #cce6ec 3px solid;
height: 25px; // height: 25px;
padding-left: 5px; // padding-left: 5px;
width: 395px; // width: 395px;
font-size: 14px; } // font-size: 14px; }
.openid-signin select, .meta select, .users-page select, .user-profile-edit-page select, .user-profile-page select { // .openid-signin select, .meta select, .users-page select, .user-profile-edit-page select, .user-profile-page select {
width: 405px; // width: 405px;
height: 30px; } // height: 30px; }
.openid-signin textarea, .meta textarea, .users-page textarea, .user-profile-edit-page textarea, .user-profile-page textarea { // .openid-signin textarea, .meta textarea, .users-page textarea, .user-profile-edit-page textarea, .user-profile-page textarea {
border: #cce6ec 3px solid; // border: #cce6ec 3px solid;
padding-left: 5px; // padding-left: 5px;
padding-top: 5px; // padding-top: 5px;
width: 395px; // width: 395px;
font-size: 14px; } // font-size: 14px; }
// .openid-signin input.submit, .meta input.submit, .users-page input.submit, .user-profile-edit-page input.submit, .user-profile-page input.submit { // .openid-signin input.submit, .meta input.submit, .users-page input.submit, .user-profile-edit-page input.submit, .user-profile-page input.submit {
// background: url(../images/small-button-blue.png) repeat-x top; // background: url(../images/small-button-blue.png) repeat-x top;
...@@ -2327,14 +2327,14 @@ label.retag-error { ...@@ -2327,14 +2327,14 @@ label.retag-error {
.hilite3 { .hilite3 {
background-color: #0ff; } background-color: #0ff; }
.gold, .badge1 { // .gold, .badge1 {
color: #ffcc00; } // color: #ffcc00; }
.silver, .badge2 { // .silver, .badge2 {
color: #cccccc; } // color: #cccccc; }
.bronze, .badge3 { // .bronze, .badge3 {
color: #cc9933; } // color: #cc9933; }
.score { .score {
font-weight: 800; font-weight: 800;
......
div.badges-intro {
margin: 20px 0;
}
div.badge-intro {
@extend .badges-intro;
.badge1, .badge2, .badge3 {
font-size: 20px;
}
}
ul.badge-list {
li.badge {
border-bottom: 1px solid #eee;
@extend .clearfix;
list-style: none;
padding: 10px 0;
&:last-child {
border-bottom: 0;
}
div.check {
float:right;
min-width:flex-grid(1,9);
text-align:right;
span {
font-size:19px;
padding-right:5px;
color:green;
}
}
div.badge-name {
float:left;
width:flex-grid(3,9);
span {
font-size: 20px;
}
}
p {
margin: 0;
float:left;
}
}
}
.gold, .badge1 {
color: #ffcc00;
}
.silver, .badge2 {
color: #cccccc;
}
.bronze, .badge3 {
color: #cc9933;
}
div.badge-desc {
> div {
margin-bottom: 20px;
span {
font-size: 18px;
@include border-radius(10px);
}
}
}
// Base extends (Merge with main stylesheet later) // Base extends (Merge with main stylesheet later)
.light-button { .light-button, a.light-button {
@include box-shadow(inset 0 1px 0 #fff); @include box-shadow(inset 0 1px 0 #fff);
@include linear-gradient(#fff, lighten(#888, 40%)); @include linear-gradient(#fff, lighten(#888, 40%));
@include border-radius(3px); @include border-radius(3px);
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
&:hover, &:focus { &:hover, &:focus {
@include linear-gradient(#fff, lighten(#888, 30%)); @include linear-gradient(#fff, lighten(#888, 37%));
border: 1px solid #ccc; border: 1px solid #ccc;
text-decoration: none; text-decoration: none;
} }
...@@ -39,11 +39,12 @@ body.askbot { ...@@ -39,11 +39,12 @@ body.askbot {
div.discussion-content { div.discussion-content {
@include box-sizing(border-box); @include box-sizing(border-box);
display: table-cell; display: table-cell;
min-width: 650px;
padding: lh(); padding: lh();
vertical-align: top; vertical-align: top;
width: flex-grid(9) + flex-gutter(); width: flex-grid(9) + flex-gutter();
.tabula-rasa { a.tabula-rasa, .tabula-rasa{
@extend .light-button; @extend .light-button;
@include border-radius(5px); @include border-radius(5px);
display: block; display: block;
...@@ -58,6 +59,7 @@ body.askbot { ...@@ -58,6 +59,7 @@ body.askbot {
&:first-child { &:first-child {
margin-top: 70px; margin-top: 70px;
} }
&:last-child { &:last-child {
margin-bottom: 70px; margin-bottom: 70px;
} }
......
...@@ -3,7 +3,6 @@ ...@@ -3,7 +3,6 @@
} }
#wmd-button-bar { #wmd-button-bar {
background: url(/static/images/askbot/editor-toolbar-background.png) repeat-x bottom;
border: 1px solid #ddd; border: 1px solid #ddd;
height:36px; height:36px;
float:left; float:left;
......
...@@ -3,7 +3,6 @@ form.answer-form { ...@@ -3,7 +3,6 @@ form.answer-form {
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
overflow: hidden; overflow: hidden;
padding-left: flex-grid(1.1); padding-left: flex-grid(1.1);
// padding-top: 20px;
textarea { textarea {
@include box-sizing(border-box); @include box-sizing(border-box);
...@@ -22,13 +21,38 @@ form.answer-form { ...@@ -22,13 +21,38 @@ form.answer-form {
.title-desc { .title-desc {
@include box-sizing(border-box); @include box-sizing(border-box);
@include border-radius(4px);
background: #333; background: #333;
color: #fff; color: #fff;
display: none;
font-size: 13px; font-size: 13px;
padding: 5px 10px; padding: 7px 14px;
width: flex-grid(6);
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
} }
&:hover {
.title-desc {
display: inline-block;
position: absolute;
margin-left: 10px;
z-index: 1;
width: 200px;
&:before {
border-color: transparent #333 transparent transparent;
border-style:solid;
border-width:12px 12px 12px 0;
content:"";
height:0;
left:-10px;
position:absolute;
top:1;
width:0;
}
}
}
} }
span.form-error, label.form-error { span.form-error, label.form-error {
...@@ -80,12 +104,8 @@ input.after-editor { ...@@ -80,12 +104,8 @@ input.after-editor {
form.question-form { form.question-form {
@extend .answer-form; @extend .answer-form;
border: none; border: none;
padding: 0; padding: 15px 0 0 0;
margin-top: -15px;
h1 a {
float: right;
}
input[type="text"] { input[type="text"] {
@include box-sizing(border-box); @include box-sizing(border-box);
...@@ -96,4 +116,3 @@ form.question-form { ...@@ -96,4 +116,3 @@ form.question-form {
margin-top: 10px; margin-top: 10px;
} }
} }
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
padding-bottom: 10px; padding-bottom: 10px;
position: absolute; position: absolute;
text-align: center; text-align: center;
z-index: 1;
h3 { h3 {
background: $mit-red; background: $mit-red;
......
body.user-profile-page { body.user-profile-page {
section.user-info {
// @extend .sidebar;
header {
@extend .clearfix;
section {
float: left;
width: flex-grid(2, 3);
margin-right: flex-gutter(3);
h1 {
@extend h2;
margin-top: 0;
}
}
p.karma {
float: left;
width: flex-grid(1, 3);
border: 1px solid #D3D3D3;
@include border-radius(3px);
@include box-shadow(inset 0 0 0 1px #fff, 0 1px 0 #fff);
background: #eee;
text-align: center;
padding: lh(.5) 0;
strong {
display: block;
font-style: 20px;
}
}
}
}
section.questions { section.questions {
h1 { h1 {
@extend .top-header; margin: 0;
} }
} }
ul.sub-info { ul.sub-info {
border-top: 1px solid #ddd; // border-top: 1px solid #ddd;
margin-top: lh(); margin-top: lh();
list-style: none; list-style: none;
> li { > li {
width: flex-grid(2.25, 9);
display: table-cell; display: table-cell;
padding: (flex-gutter(9)/2); padding: (flex-gutter(9)/2);
border-right: 1px solid #ddd; border-right: 1px dashed #efefef;
@include box-sizing(border-box); @include box-sizing(border-box);
&:first-child { &:first-child {
...@@ -60,7 +26,25 @@ body.user-profile-page { ...@@ -60,7 +26,25 @@ body.user-profile-page {
padding-right: 0; padding-right: 0;
} }
&.votes-badges {
width: flex-grid(2,9);
p {
margin-top: 15px;
}
}
&.answer-list {
width: flex-grid(4, 9);
}
&.tags-list {
width: flex-grid(3,9);
}
h2 { h2 {
margin-bottom: 30px;
margin-top: 0; margin-top: 0;
} }
...@@ -74,45 +58,67 @@ body.user-profile-page { ...@@ -74,45 +58,67 @@ body.user-profile-page {
&.user-stats-table { &.user-stats-table {
list-style: none; list-style: none;
li {
padding: 10px 0 15px;
border-top: 1px solid #eee;
}
} }
&.vote-buttons { &.vote-buttons {
list-style: none; list-style: none;
margin-bottom: 30px;
li { li {
@include border-radius(4px);
background-color: lighten(#F6EFD4, 3%); background-color: lighten(#F6EFD4, 3%);
background-position: 10px center; background-position: 10px center;
background-repeat: no-repeat; background-repeat: no-repeat;
@include border-radius(4px);
display: inline-block;
height: 20px; height: 20px;
padding: 10px 10px 10px 40px; padding: 10px 10px 10px 40px;
display: inline-block;
&.up { &.up {
background-image: url(/static/images/askbot/vote-arrow-up.png); background-color:#d1e3a8;
background-image: url(/static/images/askbot/vote-arrow-up-activate.png);
margin-right: 6px; margin-right: 6px;
span.vote-count {
color: #3f6c3e;
}
} }
&.down { &.down {
background-image: url(/static/images/askbot/vote-arrow-down.png); background-image: url(/static/images/askbot/vote-arrow-down-activate.png);
background-color:#eac6ad;
span.vote-count {
color: $mit-red;
}
} }
} }
} }
&.badges { &.badges {
@include border-radius(4px);
background-color: #e3e3e3;
@include inline-block(); @include inline-block();
a { a {
background-color: #e3e3e3;
border: 0; border: 0;
background: none; @include border-radius(4px);
text-transform: uppercase;
color: #292309; color: #292309;
display: block;
font-size: 12px; font-size: 12px;
padding: 10px; padding: 10px;
margin-bottom: 10px;
text-shadow: 0 1px 0 #fff; text-shadow: 0 1px 0 #fff;
display: block; text-transform: uppercase;
text-decoration: none;
&:hover {
background-color: #cdcdcd;
}
} }
} }
} }
......
...@@ -19,14 +19,19 @@ div.question-header { ...@@ -19,14 +19,19 @@ div.question-header {
&.post-vote { &.post-vote {
@include border-radius(4px); @include border-radius(4px);
background-color: lighten(#F6EFD4, 3%); background-color: lighten(#F6EFD4, 5%);
border: 1px solid darken( #F6EFD4,10% );
@include box-shadow(inset 0 1px 0px #fff);
} }
&.question-img-upvote, &.answer-img-upvote { &.question-img-upvote, &.answer-img-upvote {
background-image: url(/static/images/askbot/vote-arrow-up.png); background-image: url(/static/images/askbot/vote-arrow-up.png);
@include box-shadow(inset 0 1px 0px rgba(255, 255, 255, 0.5));
&:hover, &.on { &:hover, &.on {
background-color:#d1e3a8; background-color:#d1e3a8;
border-color: darken(#D1E3A8, 20%);
background-image: url(/static/images/askbot/vote-arrow-up-activate.png);
} }
} }
...@@ -34,7 +39,9 @@ div.question-header { ...@@ -34,7 +39,9 @@ div.question-header {
background-image: url(/static/images/askbot/vote-arrow-down.png); background-image: url(/static/images/askbot/vote-arrow-down.png);
&:hover, &.on { &:hover, &.on {
background-color:#eac6ad; background-color:#EAC6AD;
border-color: darken(#EAC6AD, 20%);
background-image: url(/static/images/askbot/vote-arrow-down-activate.png);
} }
} }
} }
...@@ -99,8 +106,8 @@ div.question-header { ...@@ -99,8 +106,8 @@ div.question-header {
div.post-update-container { div.post-update-container {
display: inline-block; display: inline-block;
float: left; float: left;
width: flex-grid(1.8,8); width: 20%;
border-left: 1px dotted #CCC; border-left: 1px dashed #ddd;
div.post-update-info { div.post-update-info {
@include box-sizing(border-box); @include box-sizing(border-box);
...@@ -138,7 +145,6 @@ div.question-header { ...@@ -138,7 +145,6 @@ div.question-header {
} }
span.user-badges { span.user-badges {
// display: block;
} }
} }
} }
...@@ -147,16 +153,15 @@ div.question-header { ...@@ -147,16 +153,15 @@ div.question-header {
div.comments-container { div.comments-container {
@include box-sizing(border-box); @include box-sizing(border-box);
padding: 3%;
display: inline-block; display: inline-block;
padding: 3%; padding: 0 0 3% 0;
width: 100%; width: 100%;
div.comments-content { div.comments-content {
font-size: 13px; font-size: 13px;
background: lighten(#efefef, 4%); background: #efefef;
div.block { .block {
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
padding: 15px; padding: 15px;
display: block; display: block;
...@@ -182,6 +187,7 @@ div.question-header { ...@@ -182,6 +187,7 @@ div.question-header {
aside.comment-controls { aside.comment-controls {
background: none; background: none;
border: none; border: none;
@include box-shadow(none);
display: inline-block; display: inline-block;
margin-top: -8px; margin-top: -8px;
padding:0 2% 0 0; padding:0 2% 0 0;
...@@ -250,6 +256,10 @@ div.question-header { ...@@ -250,6 +256,10 @@ div.question-header {
display: inline-block; display: inline-block;
width: 95%; width: 95%;
&#full-width {
width: 100%;
}
div.comment-meta { div.comment-meta {
text-align: right; text-align: right;
...@@ -282,8 +292,7 @@ div.question-header { ...@@ -282,8 +292,7 @@ div.question-header {
} }
div.controls { div.controls {
// padding: 15px 0; border-top: 1px solid #efefef;
background: lighten(#eeeeee, 4%);
text-align: right; text-align: right;
a { a {
display: inline-block; display: inline-block;
...@@ -310,3 +319,12 @@ div.question-status { ...@@ -310,3 +319,12 @@ div.question-status {
color: #eee; color: #eee;
} }
} }
div.share-question {
padding: 10px 0 10px 7.5%;
p {
padding: 0;
margin: 0;
}
}
div.question-list-header { div.question-list-header {
display: block; display: block;
margin-bottom: 15px; margin-bottom: 0px;
overflow: hidden; overflow: hidden;
width: flex-grid(9,9); width: flex-grid(9,9);
@extend h1.top-header; @extend h1.top-header;
h1 {
margin: 0;
> a.light-button {
float: right;
}
}
section.question-list-meta { section.question-list-meta {
display: block; display: block;
overflow: hidden; overflow: hidden;
...@@ -34,7 +42,7 @@ div.question-list-header { ...@@ -34,7 +42,7 @@ div.question-list-header {
div.question-sort { div.question-sort {
float: right; float: right;
margin-left: flex-gutter(); margin-left: flex-gutter();
margin-top: 10px; margin-top: 6px;
nav { nav {
@extend .action-link; @extend .action-link;
...@@ -79,11 +87,13 @@ div.question-list-header { ...@@ -79,11 +87,13 @@ div.question-list-header {
} }
ul.tags li { ul.tags {
background: #fff; li {
background: #fff;
&:before { &:before {
border-color: transparent #fff transparent transparent; border-color: transparent #fff transparent transparent;
}
} }
} }
} }
...@@ -103,10 +113,10 @@ ul.question-list, div#question-list { ...@@ -103,10 +113,10 @@ ul.question-list, div#question-list {
background: #F3F3F3; background: #F3F3F3;
ul.tags li { ul.tags li {
background: #fff; background: #ddd;
&:before { &:before {
border-color: transparent #fff transparent transparent; border-color: transparent #ddd transparent transparent;
} }
} }
} }
...@@ -121,7 +131,6 @@ ul.question-list, div#question-list { ...@@ -121,7 +131,6 @@ ul.question-list, div#question-list {
&.question-body { &.question-body {
@include box-sizing(border-box); @include box-sizing(border-box);
margin-right: flex-gutter(); margin-right: flex-gutter();
padding-left: 10px;
width: flex-grid(5.5,9); width: flex-grid(5.5,9);
h2 { h2 {
...@@ -131,9 +140,14 @@ ul.question-list, div#question-list { ...@@ -131,9 +140,14 @@ ul.question-list, div#question-list {
text-transform: none; text-transform: none;
} }
p.excerpt {
color: #777;
}
div.user-info { div.user-info {
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
margin-bottom: 10px;
span.relative-time { span.relative-time {
font-weight: normal; font-weight: normal;
...@@ -151,19 +165,27 @@ ul.question-list, div#question-list { ...@@ -151,19 +165,27 @@ ul.question-list, div#question-list {
} }
&.question-meta { &.question-meta {
float: right;
margin-top: 10px;
width: flex-grid(3.5,9); width: flex-grid(3.5,9);
ul { ul {
text-align: right; text-align: right;
li { li {
@include linear-gradient(#fff, #f5f5f5);
border: 1px solid #ddd; border: 1px solid #ddd;
@include box-shadow(0 1px 0 #fff);
display: inline-block; display: inline-block;
height:60px; height:60px;
@include linear-gradient(#fff, #f5f5f5);
margin-right: 10px; margin-right: 10px;
width: 60px; width: 60px;
&:last-child {
margin-right: 0px;
}
&:hover { &:hover {
span, div { span, div {
color: #555; color: #555;
...@@ -207,9 +229,18 @@ ul.question-list, div#question-list { ...@@ -207,9 +229,18 @@ ul.question-list, div#question-list {
div.post-own-question { div.post-own-question {
padding: 11px; padding: 11px;
margin-top: 10px;
color: #888;
text-align: center;
a { a {
font-weight: bold; font-weight: bold;
@extend .light-button;
padding: 20px;
display: block;
margin: 10px auto;
text-align: center;
width: flex-grid(5);
} }
} }
} }
......
div.discussion-wrapper aside { div.discussion-wrapper aside {
@extend .sidebar; @extend .sidebar;
@include box-shadow(inset 1px 0 0 #f6f6f6);
@include border-radius(0 4px 4px 0);
border-left: 1px solid #d3d3d3; border-left: 1px solid #d3d3d3;
@include border-radius(0 4px 4px 0);
border-right: 1px solid #f6f6f6; border-right: 1px solid #f6f6f6;
@include box-shadow(inset 1px 0 0 #f6f6f6);
padding: lh(); padding: lh();
width: flex-grid(3); width: flex-grid(3);
&.main-sidebar {
min-width:200px;
}
h1 {
@extend .bottom-border;
margin: (-(lh())) (-(lh())) 0;
padding: lh(.5) lh();
}
h2 { h2 {
color: #4D4D4D; color: #4D4D4D;
...@@ -22,22 +30,40 @@ div.discussion-wrapper aside { ...@@ -22,22 +30,40 @@ div.discussion-wrapper aside {
box-shadow: none; box-shadow: none;
} }
input[type="text"] { div.inputs {
width: 76%; input[type="submit"] {
width: 27%;
float: right;
}
input[type="text"] {
width: 62%;
}
} }
div.box { div.box {
@include box-shadow(0 1px 0 #eee);
border-bottom: 1px solid #d3d3d3;
display: block; display: block;
padding-bottom: 20px; margin: lh(.5) 0;
overflow: hidden;
&:last-child { &:last-child {
@include box-shadow(none); @include box-shadow(none);
border: 0; border: 0;
} }
h2 {
text-transform: uppercase;
font-weight: bold;
font-size: 14px;
letter-spacing: 1px;
&:not(.first) {
@include box-shadow(inset 0 1px 0 #eee);
border-top: 1px solid #d3d3d3;
margin: 0 (-(lh())) 0;
padding: lh(.5) lh();
}
}
&.contributors { &.contributors {
a { a {
...@@ -70,11 +96,8 @@ div.discussion-wrapper aside { ...@@ -70,11 +96,8 @@ div.discussion-wrapper aside {
} }
} }
#displayTagFilterControl {
margin-top: 10px;
}
div.search-box { div.search-box {
margin-top: lh(.5);
input { input {
@include box-sizing(border-box); @include box-sizing(border-box);
display: inline; display: inline;
...@@ -118,6 +141,34 @@ div.discussion-wrapper aside { ...@@ -118,6 +141,34 @@ div.discussion-wrapper aside {
} }
} }
div#tagSelector {
h2 {
@include box-shadow(inset 0 1px 0 #eee);
border-top: 1px solid #d3d3d3;
margin: 0 (-(lh())) 0;
padding: lh(.5) lh();
text-transform: uppercase;
font-weight: bold;
font-size: 14px;
letter-spacing: 1px;
}
ul {
margin: 0;
}
div.inputs {
margin-bottom: lh();
}
div#displayTagFilterControl {
p.choice {
@include inline-block();
margin-right: lh(.5);
}
}
}
// Question view sopecific // Question view sopecific
div.follow-buttons { div.follow-buttons {
...@@ -136,11 +187,10 @@ div.discussion-wrapper aside { ...@@ -136,11 +187,10 @@ div.discussion-wrapper aside {
div.question-stats { div.question-stats {
ul { ul {
color: #777; color: #777;
list-style: none;
li { li {
@include box-shadow(0 1px 0 #eee); padding: 7px 0 0;
border-bottom: 1px solid #d3d3d3;
padding: 7px 0;
&:last-child { &:last-child {
@include box-shadow(none); @include box-shadow(none);
...@@ -154,11 +204,105 @@ div.discussion-wrapper aside { ...@@ -154,11 +204,105 @@ div.discussion-wrapper aside {
} }
} }
div.user-info, div.user-stats {
@extend div.question-stats;
overflow: hidden;
div {
float: left;
display: block;
}
div.karma {
background: #eee;
border: 1px solid #D3D3D3;
@include border-radius(3px);
@include box-sizing(border-box);
@include box-shadow(inset 0 0 0 1px #fff, 0 1px 0 #fff);
padding: lh(.4) 0;
text-align: center;
width: flex-grid(1, 3);
float: right;
strong {
display: block;
font-style: 20px;
}
}
div.meta {
width: flex-grid(2,3);
padding-right: flex-gutter(3)*0.5;
@include box-sizing(border-box);
h2 {
border: 0;
@include box-shadow(none);
margin: 0 0 8px 0;
padding: 0;
}
p {
color: #777;
font-size: 14px;
}
}
}
div.user-stats {
overflow: visible;
ul {
font-size: 14px;
h2 {
margin:0 (-(lh())) 5px (-(lh()));
padding: lh(.5) lh();
}
}
}
div.question-tips, div.markdown {
ul {
margin-left: 8%;
}
ol {
margin-left: 8%;
}
}
div.markdown ul li { div.markdown ul li {
margin: 20px 0; margin: 20px 0;
&:first-child {
margin: 0;
}
ol li { ol li {
margin: 0; margin: 0;
} }
} }
div.view-profile {
h2 {
border-top: 0;
@include box-shadow(none);
}
a {
width: 100%;
@include box-sizing(border-box);
text-align: center;
padding: 10px;
display: block;
margin-top: 10px;
&:first-child {
margin-top: 0;
}
span {
font-weight: bold;
}
}
}
} }
...@@ -85,3 +85,10 @@ ...@@ -85,3 +85,10 @@
} }
} }
p.ie-warning {
display: block !important;
line-height: 1.3em;
background: yellow;
margin-bottom: lh();
padding: lh();
}
...@@ -52,6 +52,50 @@ footer { ...@@ -52,6 +52,50 @@ footer {
} }
} }
&.social {
float: right;
margin-right: 60px;
position: relative;
top: -5px;
@media screen and (max-width: 780px) {
float: none;
}
li {
float: left;
margin-right: lh(.5);
&:after {
content: none;
display: none;
}
a {
display: block;
height: 29px;
width: 28px;
text-indent: -9999px;
&:hover {
opacity: .8;
}
}
&.twitter a {
background: url('/static/images/marketing/twitter.png') 0 0 no-repeat;
}
&.facebook a {
background: url('/static/images/marketing/facebook.png') 0 0 no-repeat;
}
&.linkedin a {
background: url('/static/images/marketing/linkedin.png') 0 0 no-repeat;
}
}
}
} }
} }
} }
...@@ -6,6 +6,10 @@ footer { ...@@ -6,6 +6,10 @@ footer {
margin-top: $body-line-height; margin-top: $body-line-height;
padding: 0 $body-line-height; padding: 0 $body-line-height;
@media print {
display: none;
}
p { p {
float: left; float: left;
......
...@@ -3,6 +3,10 @@ div.header-wrapper { ...@@ -3,6 +3,10 @@ div.header-wrapper {
border-bottom: 1px solid #fff; border-bottom: 1px solid #fff;
@include box-shadow(inset 0 -4px 6px darken($mit-red, 5%)); @include box-shadow(inset 0 -4px 6px darken($mit-red, 5%));
@media print {
display: none;
}
header { header {
@extend .clearfix; @extend .clearfix;
@extend .wrapper; @extend .wrapper;
......
...@@ -11,13 +11,18 @@ html { ...@@ -11,13 +11,18 @@ html {
section.main-content { section.main-content {
@extend .clearfix; @extend .clearfix;
@extend .wrapper; @extend .wrapper;
@include box-sizing(border-box);
overflow: hidden;
background: #fff; background: #fff;
border: 1px solid #bbb;
border-bottom: 1px solid #bbb; border-bottom: 1px solid #bbb;
@include box-shadow(0 0 4px #dfdfdf);
@include box-sizing(border-box);
margin-top: 3px; margin-top: 3px;
@include box-shadow(0 0 4px #dfdfdf); overflow: hidden;
border: 1px solid #bbb;
@media print {
border-bottom: 0;
@include border-radius(none);
}
@media screen and (min-width: 1400px) { @media screen and (min-width: 1400px) {
@include border-radius(4px); @include border-radius(4px);
......
...@@ -47,12 +47,9 @@ div.leanModal_box { ...@@ -47,12 +47,9 @@ div.leanModal_box {
&#enroll { &#enroll {
max-width: 600px; max-width: 600px;
p.ie-warning {
display: none;
}
ol { ol {
@extend .clearfix; @extend .clearfix;
padding-top: lh();
li { li {
......
...@@ -9,11 +9,6 @@ body { ...@@ -9,11 +9,6 @@ body {
} }
div#enroll { div#enroll {
p.ie-warning {
display: block !important;
line-height: 1.3em;
}
form { form {
display: none; display: none;
} }
......
.header-wrapper {display:none;}
#accordion {display:none;}
.ui-accordion {display:none;
visibility:hidden;
width:0%;
}
...@@ -2,6 +2,13 @@ div#wiki_panel { ...@@ -2,6 +2,13 @@ div#wiki_panel {
@extend .sidebar; @extend .sidebar;
overflow: auto; overflow: auto;
h2 {
padding: lh(.5) lh();
font-size: 18px;
margin: 0 ;
@extend .bottom-border;
}
input[type="button"] { input[type="button"] {
@extend h3; @extend h3;
@include transition(); @include transition();
......
table.wiki-history {
thead {
background: #ddd;
// border-bottom: 1px solid #ddd;
tr {
height: 40px;
th {
padding-top: 10px;
padding-left: 15px;
&#revision {
width: 5%;
}
&#comment {
width: 15%;
}
&#diff {
width: 60%;
}
&#modified {
width:20%;
}
}
}
}
tbody {
tr td {
padding: 8px 15px;
}
}
tr.dark {
background-color: #efefef;
}
}
div.history-controls {
margin-top: 20px;
input[type="submit"] {
@extend .light-button;
}
}
...@@ -3,13 +3,19 @@ div.wiki-wrapper { ...@@ -3,13 +3,19 @@ div.wiki-wrapper {
width: 100%; width: 100%;
section.wiki-body { section.wiki-body {
@extend .clearfix;
@extend .content; @extend .content;
position: relative;
header { header {
@extend .topbar; @extend .topbar;
height:46px;
@include box-shadow(inset 0 1px 0 white);
&:empty { &:empty {
display: none !important; display: none !important;
border-bottom: 0;
} }
a { a {
...@@ -18,10 +24,10 @@ div.wiki-wrapper { ...@@ -18,10 +24,10 @@ div.wiki-wrapper {
p { p {
float: left; float: left;
padding: 15px;
margin-bottom: 0; margin-bottom: 0;
color: darken(#F6EFD4, 55%); color: darken(#F6EFD4, 55%);
line-height: 1em; line-height: 46px;
padding-left: lh();
} }
ul { ul {
...@@ -32,44 +38,123 @@ div.wiki-wrapper { ...@@ -32,44 +38,123 @@ div.wiki-wrapper {
float: left; float: left;
input[type="button"] { input[type="button"] {
@include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%)); @extend .block-link;
@include border-radius(0); background-color: darken(#F6EFD4, 5%);
@include transition(); background-position: 12px center;
background: darken(#F6EFD4, 5%); background-repeat: no-repeat;
border: 0; border: 0;
border-left: 1px solid darken(#f6efd4, 20%); border-left: 1px solid darken(#f6efd4, 20%);
@include border-radius(0);
@include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
color: darken(#F6EFD4, 80%); color: darken(#F6EFD4, 80%);
text-shadow: none; display: block;
font-weight: normal; font-weight: normal;
font-size: 12px; font-size: 12px;
text-transform: uppercase;
letter-spacing: 1px; letter-spacing: 1px;
padding: 14px; line-height: 46px;
margin: 0; margin: 0;
padding: 0 lh() 0 38px;
text-shadow: none;
text-transform: uppercase;
@include transition();
&.view {
background-image: url('/static/images/sequence-nav/view.png');
}
&.history {
background-image: url('/static/images/sequence-nav/history.png');
}
&.edit {
background-image: url('/static/images/sequence-nav/edit.png');
}
&:hover { &:hover {
background: none; background-color: transparent;
} }
} }
} }
} }
} }
h1.wiki-title { h2.wiki-title {
font-weight: bold; @include box-sizing(border-box);
padding-bottom: 10px; display: inline-block;
margin-bottom: 20px; float: left;
border-bottom: 1px solid #ccc; margin-bottom: 15px;
} margin-top: 0;
padding-right: flex-gutter(9);
vertical-align: top;
width: flex-grid(2.5, 9);
@media screen and (max-width:900px) {
display: block;
width: auto;
border-right: 0;
}
@media print {
display: block;
width: auto;
border-right: 0;
}
}
p { p {
line-height: 1.6em; line-height: 1.6em;
} }
#wiki_history_table { section.results {
tr.dark { @include box-sizing(border-box);
background-color: $light-gray; display: inline-block;
border-left: 1px dashed #ddd;
float: left;
padding-left: 10px;
width: flex-grid(6.5, 9);
@media screen and (max-width:900px) {
border: 0;
display: block;
padding-left: 0;
width: 100%;
width: auto;
}
@media print {
display: block;
width: auto;
padding: 0;
canvas, img {
page-break-inside: avoid;
}
}
ul.article-list {
margin-left: 15px;
width: 100%;
@media screen and (max-width:900px) {
margin-left: 0px;
}
li {
list-style: none;
margin: 0;
padding: 10px 0;
border-bottom: 1px solid #eee;
&:last-child {
border-bottom: 0;
}
h3 {
font-size: 18px;
font-weight: normal;
}
}
} }
} }
} }
} }
<nav class="sequence-nav"> <nav class="sequence-nav">
<ol> <ol>
% for t in range(1,1+len(items)): % for t in range(1,1+len(items)):
<li class="seq_inactive" id="tt_${ t }">&nbsp;</li> <li><a href="#" class="seq_inactive" id="tt_${ t }"></a></li>
% endfor % endfor
</ol> </ol>
...@@ -11,8 +11,5 @@ ...@@ -11,8 +11,5 @@
</ul> </ul>
</nav> </nav>
<div id="seq_content"></div>
<!-- <td colspan=${ len(items) }> -->
<div id="seq_content"></div>
<!-- </td> -->
...@@ -2,27 +2,29 @@ ...@@ -2,27 +2,29 @@
var ${ id }contents=["", var ${ id }contents=["",
%for t in items: %for t in items:
${t[1]['content']} , ${t['content']} ,
%endfor %endfor
"" ""
]; ];
var ${ id }types=["", var ${ id }types=["",
%for t in items: %for t in items:
"${t[1]['type']}" , "${t['type']}" ,
%endfor %endfor
"" ""
]; ];
var ${ id }init_functions=["", var ${ id }init_functions=["",
%for t in items: %for t in items:
function(){ ${t[1]['init_js']} }, function(){ ${t['init_js']} },
%endfor %endfor
""]; ""];
var ${ id }titles=${titles};
var ${ id }destroy_functions=["", var ${ id }destroy_functions=["",
%for t in items: %for t in items:
function(){ ${t[1]['destroy_js']} }, function(){ ${t['destroy_js']} },
%endfor %endfor
""]; ""];
...@@ -52,6 +54,7 @@ function ${ id }goto(i) { ...@@ -52,6 +54,7 @@ function ${ id }goto(i) {
function ${ id }setup_click(i) { function ${ id }setup_click(i) {
$('#tt_'+i).click(function(eo) { ${ id }goto(i);}); $('#tt_'+i).click(function(eo) { ${ id }goto(i);});
$('#tt_'+i).addClass("seq_"+${ id }types[i]+"_inactive"); $('#tt_'+i).addClass("seq_"+${ id }types[i]+"_inactive");
$('#tt_'+i).parent().append("<p>" + ${ id }titles[i-1] + "</p>");
} }
......
...@@ -71,12 +71,14 @@ ...@@ -71,12 +71,14 @@
</%block> </%block>
<%block name="bodyextra"> <%block name="bodyextra">
<%include file="navigation.html" args="active_page='wiki'" /> <%include file="navigation.html" args="active_page='wiki'" />
<section class="main-content"> <section class="main-content">
<div class="wiki-wrapper"> <div class="wiki-wrapper">
<%block name="wiki_panel"> <%block name="wiki_panel">
<div id="wiki_panel"> <div id="wiki_panel">
<h2>Course Wiki</h2>
<% <%
if (wiki_article is not UNDEFINED): if (wiki_article is not UNDEFINED):
baseURL = reverse("wiki_view", args=[wiki_article.get_url()]) baseURL = reverse("wiki_view", args=[wiki_article.get_url()])
...@@ -120,14 +122,14 @@ ...@@ -120,14 +122,14 @@
</li> </li>
<li class="search"> <li class="search">
<form method="POST" action='${reverse("wiki_search_articles", args=[])}'> <form method="POST" action='${reverse("wiki_search_articles", args=[])}'>
<label class="wiki_box_title">Search</label> <label class="wiki_box_title">Search</label>
<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>
<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="text" placeholder="Search" name="value" id="wiki_search_input" style="width: 71%" 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%" /> <input type="submit" id="wiki_search_input_submit" value="Go!" style="width: 20%" />
</form> </form>
</li> </li>
</ul> </ul>
...@@ -135,34 +137,33 @@ ...@@ -135,34 +137,33 @@
</%block> </%block>
<section class="wiki-body"> <section class="wiki-body">
<header>
%if wiki_article is not UNDEFINED: %if wiki_article is not UNDEFINED:
<header>
%if wiki_article.locked: %if wiki_article.locked:
<p><strong>This article has been locked</strong></p> <p><strong>This article has been locked</strong></p>
%endif %endif
<p>Last modified: ${wiki_article.modified_on.strftime("%b %d, %Y, %I:%M %p")}</p> <p>Last modified: ${wiki_article.modified_on.strftime("%b %d, %Y, %I:%M %p")}</p>
%endif %endif
%if wiki_article is not UNDEFINED: %if wiki_article is not UNDEFINED:
<ul> <ul>
<li> <li>
<input type="button" onclick="javascript:location.href='${reverse("wiki_view", args=[wiki_article.get_url()])}'" value="View" /> <input type="button" onclick="javascript:location.href='${reverse("wiki_view", args=[wiki_article.get_url()])}'" value="View" class="view" />
</li> </li>
<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 ""}/> <input type="button" onclick="javascript:location.href='${reverse("wiki_edit", args=[wiki_article.get_url()])}'" value="Edit" ${'disabled="true"' if not wiki_write else ""} class="edit"/>
</li> </li>
<li> <li>
<input type="button" onclick="javascript:location.href='${reverse("wiki_history", args=[wiki_article.get_url(),1])}'" value="History" class="button" /> <input type="button" onclick="javascript:location.href='${reverse("wiki_history", args=[wiki_article.get_url(),1])}'" value="History" class="button history" />
</li> </li>
</ul> </ul>
</header>
%endif %endif
</header>
<h1 class="wiki-title"><%block name="wiki_page_title"/></h1>
<%block name="wiki_page_title"/>
<%block name="wiki_body"/> <%block name="wiki_body"/>
</section> </section>
</div> </div>
......
...@@ -2,10 +2,10 @@ ...@@ -2,10 +2,10 @@
<%inherit file="simplewiki_base.html"/> <%inherit file="simplewiki_base.html"/>
<%block name="title"><title>Create Article - MITx 6.002 Wiki</title></%block> <%block name="title"><title>Create Article - MITx 6.002x Wiki</title></%block>
<%block name="wiki_page_title"> <%block name="wiki_page_title">
Create article <h1>Create article</h1>
</%block> </%block>
<%block name="wiki_body"> <%block name="wiki_body">
......
...@@ -2,10 +2,10 @@ ...@@ -2,10 +2,10 @@
<%inherit file="simplewiki_base.html"/> <%inherit file="simplewiki_base.html"/>
<%block name="title"><title>${"Edit " + wiki_title + " - " if wiki_title is not UNDEFINED else ""}MITx 6.002 Wiki</title></%block> <%block name="title"><title>${"Edit " + wiki_title + " - " if wiki_title is not UNDEFINED else ""}MITx 6.002x Wiki</title></%block>
<%block name="wiki_page_title"> <%block name="wiki_page_title">
${ wiki_article.title } <h1>${ wiki_article.title }</h1>
</%block> </%block>
<%block name="wiki_head"> <%block name="wiki_head">
......
...@@ -6,11 +6,11 @@ ...@@ -6,11 +6,11 @@
from django.core.urlresolvers import reverse from django.core.urlresolvers import reverse
%> %>
<%block name="title"><title>Oops... - MITx 6.002 Wiki</title></%block> <%block name="title"><title>Oops... - MITx 6.002x Wiki</title></%block>
<%block name="wiki_page_title"> <%block name="wiki_page_title">
Oops... <h1>Oops...</h1>
</%block> </%block>
......
...@@ -2,14 +2,16 @@ ...@@ -2,14 +2,16 @@
<%inherit file="simplewiki_base.html"/> <%inherit file="simplewiki_base.html"/>
<%block name="title"><title>${"Revision history of " + wiki_title + " - " if wiki_title is not UNDEFINED else ""}MITx 6.002 Wiki</title></%block> <%block name="title"><title>${"Revision history of " + wiki_title + " - " if wiki_title is not UNDEFINED else ""}MITx 6.002x Wiki</title></%block>
<%! <%!
from django.core.urlresolvers import reverse from django.core.urlresolvers import reverse
%> %>
<%block name="wiki_page_title"> <%block name="wiki_page_title">
<h1>
${ wiki_article.title } ${ wiki_article.title }
</h1>
</%block> </%block>
<%block name="wiki_body"> <%block name="wiki_body">
...@@ -17,7 +19,7 @@ ${ wiki_article.title } ...@@ -17,7 +19,7 @@ ${ 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_history_table"> <table id="wiki_history_table" class="wiki-history">
<thead> <thead>
<tr> <tr>
<th id="revision">Revision</th> <th id="revision">Revision</th>
...@@ -27,34 +29,34 @@ ${ wiki_article.title } ...@@ -27,34 +29,34 @@ ${ wiki_article.title }
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<% loopCount = 0 %> <% loopCount = 0 %>
%for revision in wiki_history: %for revision in wiki_history:
%if revision.deleted < 2 or show_delete_revision: %if revision.deleted < 2 or show_delete_revision:
<% loopCount += 1 %> <% loopCount += 1 %>
<tr style="border-top: 1px" class="${'dark ' if (loopCount % 2) == 0 else ''}${'deleted ' if (revision.deleted==2) else ''}" > <tr style="border-top: 1px" class="${'dark ' if (loopCount % 2) == 0 else ''}${'deleted ' if (revision.deleted==2) else ''}" >
<td width="15px"> <td width="15px">
<input type="radio" name="revision" id="${revision.id}" value="${revision.id}"${"checked" if wiki_article.current_revision.id == revision.id else ""}/> <input type="radio" name="revision" id="${revision.id}" value="${revision.id}"${"checked" if wiki_article.current_revision.id == revision.id else ""}/>
<label for="${revision.id}"> <label for="${revision.id}">
${ revision } ${ revision }
%if revision.previous_revision: %if revision.previous_revision:
%if not revision.counter == revision.previous_revision.counter + 1: %if not revision.counter == revision.previous_revision.counter + 1:
<br/>(based on ${revision.previous_revision}) <br/>(based on ${revision.previous_revision})
%endif %endif
%endif %endif
</label> </label>
</td> </td>
<td> <td>
${ revision.revision_text if revision.revision_text else "<i>None</i>" }</td> ${ revision.revision_text if revision.revision_text else "<i>None</i>" }</td>
<td class="diff"> <td class="diff">
%for x in revision.get_diff(): %for x in revision.get_diff():
${x|h}<br/> ${x|h}<br/>
%endfor </td> %endfor </td>
<td>${revision.get_user()} <td>${revision.get_user()}
<br/> <br/>
${revision.revision_date.strftime("%b %d, %Y, %I:%M %p")} ${revision.revision_date.strftime("%b %d, %Y, %I:%M %p")}
</td> </td>
</tr> </tr>
%endif %endif
%endfor %endfor
</tbody> </tbody>
%if wiki_prev_page or wiki_next_page: %if wiki_prev_page or wiki_next_page:
...@@ -72,17 +74,18 @@ ${ wiki_article.title } ...@@ -72,17 +74,18 @@ ${ wiki_article.title }
</tfoot> </tfoot>
%endif %endif
</table> </table>
<input type="submit" name="view" value="View revision"/> <div class="history-controls"><input type="submit" name="view" value="View revision"/>
<input type="submit" name="change" value="Change to revision" <input type="submit" name="change" value="Change to revision"
%if not wiki_write: %if not wiki_write:
disabled="true" disabled="true"
%endif %endif
/> />
%if show_delete_revision: %if show_delete_revision:
<input type="submit" name="delete" value="Admin Delete revision"/> <input type="submit" name="delete" value="Delete revision"/>
<input type="submit" name="restore" value="Admin Restore revision"/> <input type="submit" name="restore" value="Restore revision"/>
<input type="submit" name="delete_all" value="Admin Delete all revisions"> <input type="submit" name="delete_all" value="Delete all revisions">
<input type="submit" name="lock_article" value="${'Lock Article' if not wiki_article.locked else 'Unlock Article'}"> <input type="submit" name="lock_article" value="${'Lock Article' if not wiki_article.locked else 'Unlock Article'}">
%endif %endif
</div>
</form> </form>
</%block> </%block>
...@@ -2,27 +2,33 @@ ...@@ -2,27 +2,33 @@
<%inherit file="simplewiki_base.html"/> <%inherit file="simplewiki_base.html"/>
<%block name="title"><title>Search Results - MITx 6.002 Wiki</title></%block> <%block name="title"><title>Search Results - MITx 6.002x Wiki</title></%block>
<%! <%!
from django.core.urlresolvers import reverse from django.core.urlresolvers import reverse
%> %>
<%block name="wiki_page_title"> <%block name="wiki_page_title">
<h2 class="wiki-title">
%if wiki_search_query: %if wiki_search_query:
Search results for ${wiki_search_query | h} Search results for ${wiki_search_query | h}
%else: %else:
Displaying all articles Displaying all articles
%endif %endif
</h2>
</%block> </%block>
<%block name="wiki_body"> <%block name="wiki_body">
%for article in wiki_search_results: <section class="results">
<% article_deleted = not article.current_revision.deleted == 0 %> <ul class="article-list">
<a href="${reverse("wiki_view", args=[article.get_url()])}">${article.get_url()} ${'(Deleted)' if article_deleted else ''}</a><br/> %for article in wiki_search_results:
%endfor <% article_deleted = not article.current_revision.deleted == 0 %>
<li><h3><a href="${reverse("wiki_view", args=[article.get_url()])}">${article.title} ${'(Deleted)' if article_deleted else ''}</a></h3></li>
%if not wiki_search_results: %endfor
No articles matching <b>${wiki_search_query if wiki_search_query is not UNDEFINED else ""} </b>!
%endif %if not wiki_search_results:
No articles matching <b>${wiki_search_query if wiki_search_query is not UNDEFINED else ""} </b>!
%endif
</ul>
</section>
</%block> </%block>
...@@ -2,10 +2,10 @@ ...@@ -2,10 +2,10 @@
<%inherit file="simplewiki_base.html"/> <%inherit file="simplewiki_base.html"/>
<%block name="title"><title>${wiki_title + " - " if wiki_title is not UNDEFINED else ""}MITx 6.002 Wiki</title></%block> <%block name="title"><title>${wiki_title + " - " if wiki_title is not UNDEFINED else ""}MITx 6.002x Wiki</title></%block>
<%block name="wiki_page_title"> <%block name="wiki_page_title">
${ wiki_article.title } ${'<span style="color: red;">- Deleted Revision!</span>' if wiki_current_revision_deleted else ''} <h1>${ wiki_article.title } ${'<span style="color: red;">- Deleted Revision!</span>' if wiki_current_revision_deleted else ''}</h1>
</%block> </%block>
<%block name="wiki_body"> <%block name="wiki_body">
......
<%inherit file="main.html" /> <%inherit file="main.html" />
<%block name="js_extra">
<script> <script>
var page=${ page }; var page=${ page };
...@@ -32,18 +34,35 @@ function next_page() { ...@@ -32,18 +34,35 @@ function next_page() {
goto_page(newpage); goto_page(newpage);
log_event("book", {"type":"nextpage","new":page}); log_event("book", {"type":"nextpage","new":page});
} }
$("#open_close_accordion a").click(function(){
if ($(".book-wrapper").hasClass("closed")){
$(".book-wrapper").removeClass("closed");
} else {
$(".book-wrapper").addClass("closed");
}
});
</script> </script>
</%block>
<%include file="navigation.html" args="active_page='book'" /> <%include file="navigation.html" args="active_page='book'" />
<section class="main-content"> <section class="main-content">
<div class="book-wrapper"> <div class="book-wrapper">
<ul id="booknav" class="treeview-booknav">
<%include file="book_toc.html" />
</ul>
<section class="book"> <section class="book-sidebar">
<header id="open_close_accordion">
<h2>Table of Contents</h2>
<a href="#">close</a>
</header>
<ul id="booknav" class="treeview-booknav">
<%include file="book_toc.html" />
</ul>
</section>
<section class="book">
<section class="page"> <section class="page">
<nav> <nav>
<ul> <ul>
......
% if name is not UNDEFINED and name != None: % if name is not UNDEFINED and name != None:
<h1> ${name} </h1> <h1> ${name} </h1>
% endif % endif
<div class="video-wrapper">
<div class="video-player"> <div class="video-subtitles">
<div id="ytapiplayer">
<div class="video-wrapper">
<div class="video-player">
<div id="ytapiplayer">
</div>
<iframe id="html5_player" type="text/html" frameborder="0">
</iframe>
</div> </div>
<iframe id="html5_player" type="text/html" frameborder="0"> <section class="video-controls">
</iframe> <div id="slider"></div>
</div>
<section class="video-controls"> <section>
<div id="slider"></div> <ul class="vcr">
<li><a id="video_control" class="pause">Pause</a></li>
<section> <li>
<ul class="vcr"> <div id="vidtime">0:00/0:00</div>
<li><a id="video_control" class="pause">Pause</a></li> </li>
</ul> </ul>
<div id="vidtime">0:00/0:00</div>
<div class="speeds"> <div class="secondary-controls">
Speed: <div id="video_speeds"></div> <div class="speeds">
</div> <h3><a href="#">Speed</a></h3>
<ol id="video_speeds"></ol>
</div>
<a href="#" class="hide-subtitles">on</a>
</div>
</section>
</section> </section>
</section> </div>
<ol class="subtitles">
<!-- <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_n5" onclick="title_seek(-5);"></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_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_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_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_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_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( 8);"></div></li> -->
</ol>
</div> </div>
<ol class="subtitles"> <%block name="js_extra">
<!-- <li id="stt_n5"><div id="std_n7" onclick="title_seek(-7);"></div></li> --> <script type="text/javascript" charset="utf-8">
<li id="stt_n4"><div id="std_n6" onclick="title_seek(-6);"></div></li> $(function() {
<li id="stt_n4"><div id="std_n5" onclick="title_seek(-5);"></div></li> $('.hide-subtitles').click(function() {
<li id="stt_n4"><div id="std_n4" onclick="title_seek(-4);"></div></li> $('div.video-subtitles').toggleClass('closed');
<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> var link_text = $('.hide-subtitles').text();
<li id="stt_n1"><div id="std_n1" onclick="title_seek(-1);"></div></li> $(this).text((link_text == 'on') ? 'off' : 'on');
<li id="stt_0 "class="current"><div id="std_0" onclick="title_seek(0);"></div></li> return false;
<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_p3"><div id="std_p3" onclick="title_seek( 3);"></div></li> </script>
<li id="stt_p4"><div id="std_p4" onclick="title_seek( 4);"></div></li> </%block>
<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( 7);"></div></li>
<!-- <li id="stt_p6"><div id="std_p7" onclick="title_seek( 8);"></div></li> -->
</ol>
...@@ -5,7 +5,7 @@ var atts = { id: "myytplayer" }; ...@@ -5,7 +5,7 @@ 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(document.location.protocol + "//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 {
...@@ -14,7 +14,7 @@ if (swfobject.hasFlashPlayerVersion("10.1")){ ...@@ -14,7 +14,7 @@ if (swfobject.hasFlashPlayerVersion("10.1")){
$("#html5_player").show(); $("#html5_player").show();
var tag = document.createElement('script'); var tag = document.createElement('script');
tag.src = "http://www.youtube.com/player_api"; tag.src = document.location.protocol + "//www.youtube.com/player_api";
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 // Make sure the callback is called once API ready, YT seems to be buggy
...@@ -34,9 +34,13 @@ loadNewVideo(streams["1.0"], ${ position }); ...@@ -34,9 +34,13 @@ loadNewVideo(streams["1.0"], ${ position });
function add_speed(key, stream) { 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(' <li id="'+id+'">'+key+'x</li>');
$("#"+id).click(function(){ $("#"+id).click(function(){
change_video_speed(key, stream); change_video_speed(key, stream);
$(this).siblings().removeClass("active");
$(this).addClass("active");
}); });
} }
......
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