Skip to content

E
edx-platform
Commit b923b59f by Bridger Maxwell
Options

Merge 

--HG--
branch : bridger-dev
parents 67047cd1 3ce85573
Showing with 2327 additions and 1458 deletions
.DS_Store
No preview for this file type
.hgignore
......@@ -5,3 +5,5 @@ syntax: glob
*.swp
*.orig
*.DS_Store
#*
.#*
\ No newline at end of file
6002x-faq.html 0 → 100644
This diff is collapsed. Click to expand it.
6002x-press-release.html 0 → 100644
<%inherit file="marketing.html" />
<%block name="login_area">
</%block>
<section class="subpage">
<div>
<h1> <i>MITx</i> prototype course opens for enrollment&mdash;Online-learning
initiative&rsquo;s first offering, &lsquo;6.002x: Circuits and
Electronics,&rsquo; accepting registrants now.</h1>
<p> MIT News Office</p>
<p> In December,
MIT <a href="http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html">announced </a>the
launch of an online learning initiative called &ldquo;<i>MITx</i>.&rdquo;
Starting this week, interested learners can now enroll for free in the
initiative&rdquo;s prototype course -- 6.002x: Circuits and
Electronics.</p>
<p>Students can sign up for the course
at <a href="http://mitx.mit.edu">mitx.mit.edu</a>. The course will
officially begin on March 5 and run through June 8.</p>
<p> Modeled after MIT&rsquo;s 6.002 &mdash; an introductory course for
undergraduate students in MIT&rsquo;s Department of Electrical
Engineering and Computer Science (EECS) &mdash; 6.002x will introduce
engineering in the context of the lumped circuit abstraction, helping
students make the transition from physics to the fields of electrical
engineering and computer science. It will be taught by Anant Agarwal,
EECS professor and director of MIT's Computer Science and
Artificial Intelligence Laboratory (CSAIL); Chris Terman, CSAIL
co-director; EECS Professor Gerald Sussman; and CSAIL Research
Scientist Piotr Mitros.</p>
<blockquote>
<p>
&ldquo;We are very excited to begin <i>MITx</i> with this prototype
class,&rdquo; says MIT Provost L. Rafael Reif. &ldquo;We will use
this prototype course to optimize the tools we have built by
soliciting and acting on feedback from learners.&rdquo;
</p>
</blockquote>
<p>
To access the course, registered students will log in
at <a href="http://mitx.mit.edu">mitx.mit.edu</a>, where they will
find a course schedule, an e-textbook for the course, and a discussion
board. Each week, students will watch video lectures and
demonstrations, work with practice exercises, complete homework
assignments, and participate in an online interactive lab specifically
designed to replicate its real-world counterpart. Students will also
take exams and be able to check their grades as they progress in the
course. Overall, students can expect to spend approximately 10 hours
each week on the course.
</p>
<blockquote>
&ldquo;We invite you to join us for this pilot course of <i>MITx</i>,&rdquo;
Agarwal says. &ldquo;The 6.002x team of professors and teaching
assistants is excited to work with you on the discussion forum, and we
look forward to your feedback to improve the learning
experience.&rdquo;
</blockquote>
<p> <a href="http://mitx.mit.edu"> A video introduction to 6.002x can
be found here.</a></p>
<p> <a href="/6002x-faq.html"> A set of Frequently Asked Questions
about 6.002x can be found here.</a></p>
<p>
<a href="http://web.mit.edu/newsoffice/2011/mitx-faq-1219">
FAQs about <i>MITx</i> as a whole can be found here.
</a>
</p>
<p>
At the end of the prototype course, students who demonstrate their
mastery will be able to receive a certificate of completion for
free. In future <i>MITx</i> courses, students who complete the mastery
requirement on <i>MITx</i> will be able to receive the credential for a
modest fee.
</p>
<p>
Further courses are expected to become
available beginning in the fall.
</p>
<h3>
RELATED:
</h3>
<p>
<a href="/index.html">
6.002x course website
</a>
</p>
<p>
<a href="/6002x-faq.html">
6.002x FAQ
</a>
</p>
<h3>
ARCHIVE: &quot;MIT launches online learning initiative&quot;
</h3>
<a href="http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html">
http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html
</a>
<h3>
<i>MITx</i> website
</h3>
<a href="http://mitx.mit.edu">
http://mitx.mit.edu
</a>
<!--h3>
TAGS:
</h3>
<p>
<i>MITx</i>; students; education, teaching, academics; innovation and
invention; faculty; mit administration; learning; electrical
engineering and computer science; csail
</p-->
</div>
</section>
Lab2A.html deleted 120000 → 0
../data/problems/Lab2A.html
\ No newline at end of file
accordion_init.js
$("#accordion").accordion({
active: ${ active_chapter },
autoHeight: false
header: 'h3',
autoHeight: false,
});
$("#open_close_accordion a").click(function(){
if ($(".course-wrapper").hasClass("closed")){
$(".course-wrapper").removeClass("closed");
} else {
$(".course-wrapper").addClass("closed");
}
});
$('.ui-accordion').bind('accordionchange', function(event, ui) {
var event_data = {'newheader':ui.newHeader.text(),
'oldheader':ui.oldHeader.text()};
'oldheader':ui.oldHeader.text()};
log_event('accordion', event_data);
});
activation_active.html
<%inherit file="marketing.html" />
<%inherit file="main.html" />
<section class="tos">
<div>
<section class="activation">
<h1>Account already active!</h1>
<!-- <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
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>
</div>
</section>
activation_complete.html
<%inherit file="marketing.html" />
<%inherit file="main.html" />
<section class="activation">
<section class="tos">
<div>
<h1>Activation Complete!</h1>
<!-- <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>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>
</div>
</section>
activation_email.txt
Someone, hopefully you, signed up for an account for MIT's on-line
Someone, hopefully you, signed up for an account for MITx's on-line
offering of 6.002 using this email address. If it was you, and you'd
like to activate and use your account, copy and paste this address
into your web browser's address bar:
......@@ -6,4 +6,5 @@ into your web browser's address bar:
http://${ site }/activate/${ key }
If you didn't request this, you don't need to do anything; you won't
receive any more email from us.
receive any more email from us. Please do not reply to this e-mail; if
you require assistance, check the help section of the MITx web site.
activation_email_subject.txt
Your account for MIT's on-line 6.002
Your account for MITx's on-line 6.002
activation_invalid.html
<%inherit file="main.html" />
<section class="activation">
<%inherit file="marketing.html" />
<section class="tos">
<div>
<h1>Activation Invalid</h1>
<p>Something went wrong. Check to make sure the URL you went to was
correct -- e-mail programs will sometimes split it into two
lines. If you still have issues, e-mail us to let us know what happened
at <a href="mailto:bugs@mitx.mit.edu">bugs@mitx.mit.edu</a>.</p>
<p>Or you can go back to the <a href="/">6.002x course page</a>.</p>
</div>
</section>
courseware.html
......@@ -27,9 +27,16 @@
<section class="main-content">
<div class="course-wrapper">
<div id="accordion">
${accordion}
</div>
<section class="course-index">
<div id="open_close_accordion">
<h2>Courseware Index</h2>
<a href="#">close</a>
</div>
<div id="accordion">
${accordion}
</div>
</section>
<section class="course-content">
${content}
......
create_account.html
<!-- TODO: Add pattern field to username. See HTML5 cookbook, page 84 for details-->
<div name="enroll_form" id="enroll_form">
<h1>Enroll in 6.002 Circuits &amp; Electronics</h1>
<h1>Enroll in 6.002x Circuits &amp; Electronics</h1>
<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>
<form name="enroll" id="enroll_form" method="get">
<fieldset><% if 'error' in locals(): e = error %>
......@@ -11,26 +14,26 @@
<li class="email">
<label>E-mail*</label>
<input name="email" id="ca_email" type="email" required />
<input name="email" id="ca_email" type="email" />
</li>
<li class="password">
<label>Password*</label>
<input name="password" id="ca_password" type="password" required />
<input name="password" id="ca_password" type="password" />
</li>
<li class="username">
<label>Username (public)* <span class="ui-icon ui-icon-help" id="spinner_nick" style="display:inline-block;"></span></label>
<input name="username" id="ca_username" type="text" required />
<input name="username" id="ca_username" type="text" />
<div id="sregion_nick" class="tip">Nickname you'd like to use on forums.</div>
</li>
<li class="full-name">
<label>Full name<span class="ui-icon ui-icon-help" id="spinner_name" style="display:inline-block;"></span></label>
<input name="name" id="ca_name" type="text" />
<label>Full name*<span class="ui-icon ui-icon-help" id="spinner_name" style="display:inline-block;"></span></label>
<input name="name" id="ca_name" type="text" />
<div class="tip" id="sregion_name">If you would like us to give you a certificate of completion at the end, we need your full legal name, as you would like it to appear on the certificate (e.g. &quot;John Smith, Jr&quot;).</div>
<div class="tip" id="sregion_name">If you successfully complete the course, you will receive an electronic certificate of accomplishment from <i>MITx</i> with this name on it.</div>
</li>
<li class="location">
......@@ -49,16 +52,17 @@
</li>
<li class="terms">
<label> <input name="terms_of_service" id="cb_terms_of_service" type="checkbox" value="terms_of_service" required />I agree to the Terms of Service*</label>
<label> <input name="terms_of_service" id="cb_terms_of_service" type="checkbox" value="terms_of_service" />I agree to the <a href="/t/tos.html">Terms of Service</a>*</label>
</li>
<li class="honor-code">
<label>
<input name="honor_code" id="cb_honor_code" type="checkbox" value="honor_code" required />I agree to the Honor code.*</label>
<input name="honor_code" id="cb_honor_code" type="checkbox" value="honor_code" />I agree to the <a href="/t/honor.html">Honor Code</a>, summarized as:*</label>
<ul>
<li>Complete all mid-terms and final exams with only my own work.</li>
<li>Maintain only one account, and not share the username or password.</li>
<li>Not engage in any activities that would dishonestly improve my results, or improve or hurt those of others.</li>
<li>Never post answers to problems.</li>
<li>Maintain only one account.</li>
<li>Not post answers to problems that are being used to assess student performance.</li>
</ul>
</li>
......
index.html
<%inherit file="marketing.html" />
<%inherit file="marketing.html" />
<%block name="title">MITx 6.002x: Circuits & Electronics</%block>
<%block name="description">6.002x (Circuits and Electronics) is an experimental on-line adaptation of MIT's first undergraduate analog design course: 6.002.</%block>
<%block name="keywords">MITx, circuits, electronics, EECS, electrical engineering, analog circuits, digital circuits, online learning, MIT, online laboratory, education, learners, undergraduate, certificate</%block>
<%block name="header_text">
<section class="course">
<section>
<h1>Circuits &amp; Electronics</h1>
<h2>6.002x</h2>
<a class="enroll" rel="leanModal" href="#enroll">Enroll in 6.002x Circuits <span>&amp;</span> Electronics</a>
<a class="enroll" rel="leanModal" href="#enroll"><noscript>In order to</noscript> Enroll in 6.002x Circuits <span>&amp;</span> Electronics <noscript>you need to have javascript enabled</noscript></a>
</section>
<p>6.002x (Circuits and Electronics) is an experimental on-line adaptation of MIT&rsquo;s first undergraduate analog design course: 6.002. This course will run, free of charge, for students worldwide from March 1, 2012 through June 8, 2012.</p>
<p>6.002x (Circuits and Electronics) is an experimental on-line adaptation of MIT&rsquo;s first undergraduate analog design course: 6.002. This course will run, free of charge, for students worldwide from March 5, 2012 through June 8, 2012.</p>
</section>
</%block>
......@@ -31,7 +35,7 @@
<p>If you successfully complete the course, you will receive an electronic certificate of accomplishment from <em>MITx</em>. This certificate will indicate that you earned it from <em>MITx&rsquo;s</em> pilot course. In this prototype version, <em>MITx</em> will not require that you be tested in a testing center or otherwise have your identity certified in order to receive this certificate.</p>
<p>The course uses the textbook Foundations of Analog and Digital Electronic Circuits, by Anant Agarwal and Jeffrey H. Lang. Morgan Kaufmann Publishers, Elsevier, July 2005. While recommended, the book is not required: relevant sections will be provided electronically as part of the online course for personal use in connection with this course only. The copyright for the book is owned by Elsevier. The book can be purchased on <a href="http://www.amazon.com/exec/obidos/ASIN/1558607358/ref=nosim" target="_blank">Amazon</a>.</p>
<p>The course uses the textbook Foundations of Analog and Digital Electronic Circuits, by Anant Agarwal and Jeffrey H. Lang. Morgan Kaufmann Publishers, Elsevier, July 2005. While recommended, the book is not required: relevant sections will be provided electronically as part of the online course for personal use in connection with this course only. The copyright for the book is owned by Elsevier. The book can be purchased on <a href="http://www.amazon.com/exec/obidos/ASIN/1558607358/ref=nosim/mitopencourse-20" target="_blank">Amazon</a>.</p>
</section>
<section class="requirements">
......@@ -48,7 +52,7 @@
</section>
<section class="cta">
<a class="enroll" rel="leanModal" href="#enroll">Enroll in 6.002x Circuits &amp; Electronics</a>
<a class="enroll" rel="leanModal" href="#enroll"><noscript>In order to</noscript> Enroll in 6.002x Circuits &amp; Electronics <noscript>you need to have javascript enabled</noscript></a>
</section>
</section>
......@@ -58,17 +62,17 @@
<ul>
<li>
<img src="/static/staff/agarwal-mit-news-small.jpg">
<img src="/static/staff/agarwal-mit-news-small.jpg" alt="Anant Agarwal">
<h2>Anant Agarwal</h2>
<p>Director of MIT&rsquo;s Computer Science and Artificial Intelligence Laboratory (CSAIL) and a professor of the Electrical Engineering and Computer Science department at MIT. His research focus is in parallel computer architectures and cloud software systems, and he is a founder of several successful startups, including Tilera, a company that produces scalable multicore processors. Prof. Agarwal won MIT&rsquo;s Smullin and Jamieson prizes for teaching and co-authored the course textbook &ldquo;Foundations of Analog and Digital Electronic Circuits.&rdquo;</p></li>
<li>
<img src="/static/staff/gjs-small.jpg">
<img src="/static/staff/gjs-small.jpg" alt="Gerald Sussman">
<h2>Gerald Sussman</h2>
<p>Professor of Electrical Engineering at MIT. He is a well known educator in the computer science community, perhaps best known as the author of Structure and Interpretation of Computer Programs, which is universally acknowledged as one of the top ten textbooks in computer science, and as the creator of Scheme, a popular teaching language. His research spans a range of topics, from artificial intelligence, to physics and chaotic systems, to supercomputer design.</p></li>
<li>
<img src="/static/staff/pmitros-small.jpg">
<img src="/static/staff/pmitros-small.jpg" alt="Piotr Mitros">
<h2>Piotr Mitros</h2>
<p>Research Scientist at MIT. His research focus is in finding ways to apply techniques from control systems to optimizing the learning process. Dr. Mitros has worked as an analog designer at Texas Instruments, Talking Lights, and most recently, designed the analog front end for a novel medical imaging modality for Rhythmia Medical.</p></li>
</ul>
......@@ -102,7 +106,7 @@ $(function() {
if(json.success) {
$('#enroll').html(json.value);
} else {
$('#enroll_error').html(json.value);
$('#enroll_error').html(json.value).stop().css("background-color", "#933").animate({ backgroundColor: "#333"}, 2000);
}
}
);
......
login.html
<!-- TODO: http://docs.jquery.com/Plugins/Validation -->
${ error }
<div id="login_div">
<header>
<h1>Log in to MITx</h1>
......
main.html
<!DOCTYPE html>
<html>
<head>
<%block name="title"><title>MITx 6.002</title></%block>
<%block name="title"><title>MITx 6.002x</title></%block>
<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 href="/static/css/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css"/>
<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>
......@@ -38,7 +37,7 @@
</head>
<body>
<body class="<%block name="bodyclass"/>">
${self.body()}
<%block name="bodyextra"/>
......
marketing.html
<!DOCTYPE html>
<html>
<head>
<%block name="title"><title>MITx 6.002</title></%block>
<title><%block name="title">MITx: MIT's new online learning initiative</%block></title>
<meta name="description" content="<%block name="description">MITx will offer a portfolio of MIT courses for free to a virtual community of learners around the world</%block>" />
<meta name="keywords" content="<%block name="keywords">MITx, online learning, MIT, online laboratory, education, learners, undergraduate, certificate</%block>" />
<!--link rel="stylesheet" href="${ settings.LIB_URL }jquery.treeview.css" type="text/css" media="all" /-->
<link rel="stylesheet" href="/static/css/marketing.css" type="text/css" media="all" />
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<!--[if lt IE 8]>
<link rel="stylesheet" href="/static/css/marketing-ie.css" type="text/css" media="all" />
<![endif]-->
......@@ -68,7 +73,9 @@ function postJSON(url, data, callback) {
<nav>
<h1><a href="http://mitx.mit.edu/">MITx</a></h1>
% if settings.COURSEWARE_ENABLED:
<%block name="login_area">
<a rel="leanModal" class="login" href="#login">Log In</a>
</%block>
% endif
</nav>
</%block>
......@@ -94,13 +101,13 @@ function postJSON(url, data, callback) {
<li><a href="/t/tos.html">Terms of Service</a></li>
<li><a href="/t/privacy.html">Privacy Policy</a></li>
<li><a href="/t/honor.html">Honor Code</a></li>
<li><a href="/t/mitx_help.html">Help</a></li>
</ul>
</div>
</footer>
% if settings.COURSEWARE_ENABLED:
<div id="login" class="leanModal_box"><%include file="login.html" /></div>
<div id="enroll" class="leanModal_box" name="enroll"><%include file="create_account.html" /></div>
% endif
<div id="pwd_reset" class="leanModal_box"><%include file="password_reset_form.html" /></div>
<div id="reset_done" class="leanModal_box"></div>
......@@ -142,7 +149,7 @@ $(document).ready(function(){
if (json.success) {
$('#pwd_reset').html(json.value);
} else {
$('#pwd_error').html(json.error);
$('#pwd_error').html(json.error).stop().css("background-color", "#933").animate({ backgroundColor: "#333"}, 2000);
}
}
);
......
mitx-overview.html 0 → 100644
<%inherit file="marketing.html" />
<%block name="login_area">
</%block>
<section class="subpage">
<div>
<h1> <i>MITx</i> Advances MIT&rsquo;s Vision for Online Learning</h1>
<p> Education has entered an era of rapid, exciting,
technology-enabled change. At MIT, we welcome the opportunity to
harness the power of on-line technology for our students and for the
world. On December 19, 2011, we announced <i>MITx</i>, an initiative to
offer exciting, challenging and enriching courses to anyone,
anywhere, who has the motivation and ability to engage MIT&rsquo;s
educational content.</p>
<p> Ten years ago, MIT
launched <a href="http://ocw.mit.edu/index.htm">OpenCourseWare</a>,
which places online the course materials for substantially the entire
MIT curriculum, and was the genesis of today&rsquo;s worldwide
movement in free, open educational resources. <i>MITx</i> is the next step
in opening MIT&rsquo;s educational doors to the world. Through OCW and
<i>MITx</i>, MIT invites the world to join it in the passion, hard work and
thrill of learning and discovery.</p>
<h2><i>MITx</i> will e-publish interactive online courses that:</h2>
<ul>
<li>Empower students to learn at their own pace;</li>
<li>Offer online laboratories where students can experiment and apply their learning;</li>
<li>Connect students to each other in online discussion groups and wiki-based collaborative learning; </li>
<li>Challenge learners with MIT-rigor course materials; and</li>
<li>Assess individual student learning as the student progresses through the course.</li>
</ul>
<p> <i>MITx</i> students who demonstrate their mastery of a subject can earn
a certificate of completion awarded by <i>MITx</i>.</p>
<p> <i>MITx</i> courses will be available to the world through an Internet
platform that MIT will make freely available. MIT hopes that other
educational institutions, anywhere in the world, will adapt and use
the platform to publish their own educational content online for the
benefit of learners. Because the platform will be open-source and
scalable, adopters and users can continuously improve it, for the
benefit of everyone.</p>
<h2> Why Is MIT Creating <i>MITx</i>?</h2>
<p> Excellence in teaching and learning. MIT must always provide its
students the very best teaching and learning tools possible. MIT
began experimenting with online technologies in its educational
programs long before we launched OCW in 2001. We have only increased
our emphasis in recent years, as several MIT committees have studied
how MIT might enhance the learning experience of its students and
expand its impact worldwide through new online offerings.</p>
<p> These efforts, combined with those of numerous individual MIT
faculty members, confirmed MIT&rsquo;s conviction that digital
technologies enrich learning. Many other innovative institutions and
enterprises believe the same and are bringing creative online
offerings forward. Having brain-stormed, investigated and studied,
we were ready to act and eager to start. We announced our <i>MITx</i>
aspiration to capture and encourage the energy of our faculty in
creating new online teaching and learning tools. </p>
<p> Once up and running, <i>MITx</i> will be a laboratory for online
learning. Whether <i>MITx</i> learners are MIT&rsquo;s on-campus students,
university students elsewhere, or independent learners, <i>MITx</i> will help
us understand how online learning occurs and how virtual communities
of learners assemble -- information that in turn will allow us to
improve both <i>MITx</i> and our on-campus teaching. </p>
<p> Access to higher education. <i>MITx</i> will help shatter barriers to
education. The constraints of MIT&rsquo;s physical campus allow us to
admit less than 10 percent of our undergraduate applicants. We teach
on-campus only a tiny fraction of the people in the world with the
ability and motivation to learn MIT content. Online technology
provides a new and different portal into MIT-quality education.
Through <i>MITx</i>, MIT educational content can reach, augment, and enrich
the education and livelihood of many learners who cannot attend
MIT. </p>
<p> <i>MITx</i> does not provide a full MIT education. Our residential
campus is the heart of MIT&rsquo;s knowledge creation and
dissemination. MIT students enjoy a comprehensive curriculum and
distinct educational environment. Without MIT, there would be no
<i>MITx</i>. </p>
<p> Advancing the public good. <i>MITx</i> is an opportunity to help
preserve and expand higher education as a public good. Historically,
the investment of public and private assets in enormous amounts has
produced the public benefits of knowledge creation and dissemination,
leading to capable citizens, innovation, job creation, economic
development, and broader welfare.</p>
<p> Today, as computation and Internet technologies enable higher
education to migrate online, MIT sees the opportunity to democratize
education with unprecedented efficiency and scalability. We possess a
strong desire and feel a compelling obligation to offer a
not-for-profit, mission-driven, open-technology approach to online
learning. <i>MITx</i> is our contribution. </p>
</div>
</section>
mitx_global.html
......@@ -12,7 +12,7 @@
</section>
<section class="intro-video">
<a rel="leanModal" href="#video-overlay"><img src="/static/images/video-image.png" alt="" /><span> Watch intro video</span></a>
<a id="video-overlay-link" rel="leanModal" href="#video-overlay"><img src="/static/images/video-image.png" id="video-img" alt="Link to MITx introduction video" /><span> Watch intro video</span></a>
</section>
</section>
......@@ -27,7 +27,7 @@
<li>operates on an open-source, scalable software infrastructure in order to make it continuously improving and readily available to other educational institutions, such as universities and K-12 school systems.</li>
</ul>
<p><strong>Press &amp; links:</strong> <a href="http://www.boston.com/news/local/massachusetts/articles/2011/12/19/mit_to_launch_online_only_graded_courses_free_to_all/?page=full" target="_blank">Boston Globe</a>, <a href="http://www.nytimes.com/2011/12/19/education/mit-expands-free-online-courses-offering-certificates.html?_r=3&hpw=" target="_blank">New York Times</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html" target="_blank">MIT Press Release</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-faq-1219" target="_blank"><em>MITx</em> FAQ</a></p>
<p><strong>Press &amp; links:</strong> <a href="/6002x-press-release.html">6.002x Press Release</a>, <a href="/6002x-faq.html">6.002x FAQ</a>, <a href="/mitx-overview.html">MITx overview</a>, <a href="http://www.boston.com/news/local/massachusetts/articles/2011/12/19/mit_to_launch_online_only_graded_courses_free_to_all/?page=full" target="_blank">Boston Globe</a>, <a href="http://www.nytimes.com/2011/12/19/education/mit-expands-free-online-courses-offering-certificates.html?_r=3&hpw=" target="_blank">New York Times</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html" target="_blank">MIT Press Release</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-faq-1219" target="_blank"><em>MITx</em> FAQ</a>, <a href="http://ocw.mit.edu/index.htm" target="_blank">OpenCourseWare</a></p>
</section>
</section>
......@@ -40,20 +40,40 @@
</hgroup>
<p>
<a href="http://6002x.mitx.mit.edu/" class="more-info">More information <span>&amp;</span> Enroll</a>
<a href="http://6002x.mitx.mit.edu/" class="more-info">More information <span>&amp;</span> Enroll <span class="arrow">&#8227;</span></a>
</p>
<p>Taught by Anant Agarwal, with Gerald Sussman and Piotr Mitros, 6.002x (Circuits and Electronics) is an on-line adaption of 6.002, MIT&rsquo;s first undergraduate analog design course. This prototype course will run, free of charge, for students worldwide from March 1, 2012 through June 8, 2012. Students will be given the opportunity to demonstrate their mastery of the material and earn a certificate from <em>MITx</em>.</p>
<p>Taught by Anant Agarwal, with Gerald Sussman and Piotr Mitros, 6.002x (Circuits and Electronics) is an on-line adaption of 6.002, MIT&rsquo;s first undergraduate analog design course. This prototype course will run, free of charge, for students worldwide from March 5, 2012 through June 8, 2012. Students will be given the opportunity to demonstrate their mastery of the material and earn a certificate from <em>MITx</em>.</p>
</section>
</section>
<div id="video-overlay" class="leanModal_box">
<iframe width="560" height="315" src="http://www.youtube.com/embed/p2Q6BrNhdh8?rel=0" frameborder="0" allowfullscreen></iframe>
<iframe id="player" type="text/html" width="560" height="390" src="http://www.youtube.com/embed/p2Q6BrNhdh8?enablejsapi=1" frameborder="0">
</iframe>
</div>
<script>
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('player', {
});
}
$(function() {
var tag = document.createElement('script');
tag.src = "http://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
$("a#video-overlay-link").click(function(){
player.playVideo();
$("a.modal_close, #lean_overlay").click(function(){
player.pauseVideo();
});
});
// TODO: Clean up as per http://stackoverflow.com/questions/169506/obtain-form-input-fields-using-jquery
/* Handles when the user hits 'enroll'. Grabs form data. Does AJAX.
......@@ -89,7 +109,7 @@ $(function() {
});
})
/*$("sregion"+$("[id^=spinner_]")[1].id.substring(7)) */
});
</script>
mitx_help.html 0 → 100644
<%inherit file="marketing.html" />
<section class="tos">
<div>
<section class="help-email">
<h2>Help &amp; Feedback</h2>
<p> If run into problems signing up for the web site which you
cannot resolve on your own, please check
the <a href="http://mitx.mit.edu/6002x-faq.html">Frequently
Asked Questions</a>. If you find a bug or other issues, you can
reach us at:</p>
<dl>
<dt>System-related questions</dt>
<dd><a href="mailto:technical@mitx.mit.edu">technical@mitx.mit.edu</a></dd>
<dt>Content-related questions</dt>
<dd><a href="mailto:content@mitx.mit.edu">content@mitx.mit.edu</a></dd>
<dt>Bug reports</dt>
<dd><a href="mailto:bugs@mitx.mit.edu">bugs@mitx.mit.edu</a></dd>
<dt>Suggestions</dt>
<dd><a href="mailto:suggestions@mitx.mit.edu">suggestions@mitx.mit.edu</a></dd>
</dl>
<p> Please bear in mind that while we read them, we do not expect to
have time to respond to all e-mails.</p>
</section>
</div>
</section>
navigation.html
......@@ -7,7 +7,6 @@
</hgroup>
<nav class="${active_page}">
<ul class="coursenav">
<li class="courseware"><a href="/courseware">Courseware</a></li>
<li class="info"><a href="/info">Course Info</a></li>
......
problem.js
......@@ -13,11 +13,15 @@ function ${ id }_load() {
postJSON('/modx/problem/${ id }/problem_check',
submit_data,
function(json) {
if(json['success'] == 'syntax')
alert('Syntax error');
else
${ id }_load();
switch(json.success) {
case 'incorrect': // Worked, but answer not
case 'correct':
${ id }_load();
//alert("!!"+json.success);
break;
default:
alert(json.success);
}
});
log_event('problem_check', submit_data);
});
......
profile.html
......@@ -91,49 +91,45 @@ $(function() {
<div id="grade-detail-graph" style="width:650px;height:200px;"></div>
<ol>
<%
lastChapter = None
%>
% for hw in homeworks:
<ol class="chapters">
%for chapter in chapters:
%if not chapter['chapter'] == "hidden":
<li>
%if hw['chapter'] != lastChapter:
<h2><a href="${reverse('courseware_chapter', args=format_url_params([hw['course'], hw['chapter']])) }">
${ hw['chapter'] }</a></h2>
<% lastChapter = hw['chapter'] %>
%else:
<h2>-</h2>
%endif
<div class="scores">
<h3><a href="${reverse('courseware_section', args=format_url_params([hw['course'], hw['chapter'], hw['section']])) }">
<%
earned = hw['section_total'][0]
total = hw['section_total'][1]
percentageString = "{0:.0%}".format( float(earned)/total) if earned > 0 else ""
%>
${ hw['section'] }</a> ${"({0}/{1}) {2}".format( earned, total, percentageString )}</h3>
${hw['subtitle']}
% if 'due' in hw and hw['due']!="":
due ${hw['due']}
% endif
<ul>
%if len(hw['scores']) > 0:
%if hw['graded']:
Problem Scores:
%else:
Practice Scores:
%endif
% for score in hw['scores']:
<li>${ score[0] }/${ score[1] }</li>
% endfor
<h2><a href="${reverse('courseware_chapter', args=format_url_params([chapter['course'], chapter['chapter']])) }">
${ chapter['chapter'] }</a></h2>
<ol class="sections">
%for section in chapter['sections']:
<li>
<%
earned = section['section_total'][0]
total = section['section_total'][1]
percentageString = "{0:.0%}".format( float(earned)/total) if earned > 0 else ""
%>
<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['subtitle']}
%if 'due' in section and section['due']!="":
due ${section['due']}
%endif
</ul>
</div>
</li>
% endfor
</ol>
%if len(section['scores']) > 0:
<ol class="scores">
${ "Problem Scores: " if section['graded'] else "Practice Scores: "}
%for score in section['scores']:
<li class="score">${ score[0] }/${ score[1] }</li>
%endfor
</ol>
%endif
</li> <!--End section-->
%endfor
</ol> <!--End sections-->
</li> <!--End chapter-->
%endif
%endfor
</ol> <!--End chapters-->
</section>
<section class="user-info">
......
profile_graphs.js
......@@ -127,7 +127,7 @@ $(function () {
var plot = $.plot($grade_detail_graph, series, options);
var o = plot.pointOffset({x: ${overviewBarX} , y: ${totalScore}});
$grade_detail_graph.append('<div style="position:absolute;left:' + (o.left - 12) + 'px;top:' + (o.top - 20) + 'px">${"{:.0%}".format(totalScore)}</div>');
$grade_detail_graph.append('<div style="position:absolute;left:' + (o.left - 12) + 'px;top:' + (o.top - 20) + 'px">${"{totalscore:.0%}".format(totalscore=totalScore)}</div>');
// //Rotate the x-axis labels
// var rotateValue = "rotate(-60deg)";
......
registration/activation_email.txt deleted 100644 → 0
{% load humanize %}
Someone, hopefully you, signed up for a new account at djangoproject.com using this email address. If it was you, and you'd like to activate and use your account, click the link below or copy and paste it into your web browser's address bar:
http://127.0.0.1:8000/accounts/activate/{{ activation_key }}/
If you didn't request this, you don't need to do anything; you won't receive any more email from us, and the account will expire automatically in {{ expiration_days|apnumber }} days.
registration/activation_email_subject.txt deleted 100644 → 0
Activate your djangoproject.com account - you have {{ expiration_days }} days!
registration/password_reset_confirm.html
......@@ -18,7 +18,7 @@
<h1>Password reset unsuccessful</h1>
<p>The password reset link was invalid, possibly because it has already been used. Please request a new password reset.</p>
<p>The password reset link was invalid, possibly because the link has already been used. Please request a new password reset.</p>
{% endif %}
......
registration/password_reset_email.html
......@@ -3,7 +3,7 @@
{% trans "Please go to the following page and choose a new password:" %}
{% block reset_link %}
https://6002x.mitx.mit.edu{% url 'django.contrib.auth.views.password_reset_confirm' uidb36=uid token=token %}
{{ protocol }}://{{ site_name }}{% url 'django.contrib.auth.views.password_reset_confirm' uidb36=uid token=token %}
{% endblock %}
{% trans "Your username, in case you've forgotten:" %} {{ user.username }}
......
sass/.DS_Store
No preview for this file type
sass/reademe.md → sass/README
......@@ -5,7 +5,13 @@ $ gem install sass
We are also using Bourbon with sass. They are a generic set of mixins, and functions that allow for more rapid development of CSS3. Find out more about bourbon here: https://github.com/thoughtbot/bourbon
Then to generate Sass files cd to templates directory and watch the sass files with:
To use bourbon you need to install it with:
$ gem install bourbon
Then to generate Sass files cd to templates directory and watch the sass files for developement:
$ sass --watch sass:../static/css/ -r ./sass/bourbon/lib/bourbon.rb
This will automatically generate the CSS files on save.
To generate a compressed css file for production:
$ sass --watch sass:../static/css/ -r ./sass/bourbon/lib/bourbon.rb --style :compressed
These will automatically generate the CSS files on save.
sass/_activation.scss deleted 100644 → 0
section.activation {
@extend .wrapper;
@include box-shadow(0 1px 0 #fff);
@include box-sizing(border-box);
background: #fff;
border-top: 0;
border: 1px solid #ccc;
max-width: 600px;
padding: lh();
margin-top: lh();
}
sass/_index.scss deleted 100644 → 0
body {
background-color: #fff;
color: #444;
font: $body-font-size $body-font-family;
:focus {
outline-color: #ccc;
}
h1 {
font: 800 24px $header-font-family;
}
li {
margin-bottom: lh();
}
em {
font-style: italic;
}
a {
color: $mit-red;
font-style: italic;
text-decoration: none;
&:hover, &:focus {
color: darken($mit-red, 10%);
}
}
#{$all-text-inputs}, textarea {
@include box-shadow(0 -1px 0 #fff);
@include linear-gradient(#eee, #fff);
border: 1px solid #999;
font: $body-font-size $body-font-family;
padding: 4px;
width: 100%;
&:focus {
border-color: $mit-red;
}
}
}
header.announcement {
@include background-size(cover);
background: #333;
border-bottom: 1px solid #000;
color: #fff;
-webkit-font-smoothing: antialiased;
&.home {
background: #e3e3e3 url("/static/images/marketing/shot-5-medium.jpg");
@media screen and (min-width: 1200px) {
background: #e3e3e3 url("/static/images/marketing/shot-5-large.jpg");
}
// @media screen and (max-width: 1199px) {
// }
div {
padding: lh(10) lh() lh(3);
//hide login link for homepage
nav {
h1 {
margin-right: 0;
}
a.login {
display: none;
}
}
}
}
&.course {
background: #e3e3e3 url("/static/images/marketing/course-bg-small.jpg");
@media screen and (min-width: 1200px) {
background: #e3e3e3 url("/static/images/marketing/course-bg-large.jpg");
}
@media screen and (max-width: 1199px) and (min-width: 700px) {
background: #e3e3e3 url("/static/images/marketing/course-bg-medium.jpg");
}
div {
padding: lh(4) lh() lh(2);
}
}
div {
@extend .wrapper;
position: relative;
nav {
position: absolute;
top: 0;
right: lh();
@include border-radius(0 0 3px 3px);
background: #333;
background: rgba(#000, .7);
padding: lh(.5) lh();
h1 {
@include inline-block();
margin-right: lh(.5);
a {
font: italic 800 18px $header-font-family;
color: #fff;
text-decoration: none;
&:hover, &:focus {
color: #999;
}
}
}
a.login {
text-decoration: none;
color: #fff;
font-size: 12px;
font-style: normal;
font-family: $header-font-family;
&:hover, &:focus {
color: #999;
}
}
}
section {
@extend .clearfix;
@include inline-block();
background: $mit-red;
margin-left: flex-grid(4) + flex-gutter();
padding: lh() lh(1.5);
h1 {
@include inline-block();
font-family: "Open Sans";
font-size: 30px;
font-weight: 800;
line-height: 1.2em;
margin: 0 lh() 0 0;
}
h2 {
@include inline-block();
font-family: "Open Sans";
font-size: 24px;
font-weight: 400;
line-height: 1.2em;
}
&.course {
section {
width: flex-grid(4, 8);
margin-right: flex-gutter(8);
float: left;
margin-left: 0;
padding: 0;
a {
@extend .button;
@include box-shadow(inset 0 1px 0 darken($mit-red, 10%), 0 1px 0 lighten($mit-red, 5%));
background-color: darken($mit-red, 20%);
display: block;
padding: lh(.5) lh();
border-color: darken($mit-red, 30%);
text-align: center;
&:hover {
background-color: darken($mit-red, 10%);
border-color: darken($mit-red, 20%);
}
}
}
p {
width: flex-grid(4, 8);
line-height: lh();
float: left;
}
}
}
}
}
section.index-content {
@extend .wrapper;
@extend .clearfix;
section {
@extend .clearfix;
float: left;
h1 {
font-size: 24px;
font-weight: 800;
font-family: "Open Sans";
margin-bottom: lh();
}
p {
line-height: lh();
margin-bottom: lh();
}
ul {
margin: 0;
// list-style: disc outside none;
// li {
// list-style: disc outside none;
// }
}
&.about {
@include box-sizing(border-box);
border-right: 1px solid #e5e5e5;
margin-right: flex-gutter();
padding-right: flex-gutter() / 2;
width: flex-grid(8);
section {
@extend .clearfix;
margin-bottom: lh();
p {
width: flex-grid(4, 8);
float: left;
&:nth-child(odd) {
margin-right: flex-gutter(8);
}
}
&.intro {
section {
margin-bottom: 0;
&.intro-text {
margin-right: flex-gutter(8);
width: flex-grid(4, 8);
p {
margin-right: 0;
width: auto;
float: none;
}
}
&.intro-video {
width: flex-grid(4, 8);
a {
display: block;
width: 100%;
img {
width: 100%;
}
span {
display: none;
}
}
}
}
}
&.features {
border-top: 1px solid #E5E5E5;
padding-top: lh();
margin-bottom: 0;
h2 {
text-transform: uppercase;
letter-spacing: 1px;
color: #666;
margin-bottom: lh();
span {
text-transform: none;
}
}
p {
width: auto;
clear: both;
strong {
font-family: "Open sans";
font-weight: 800;
}
a {
color: $mit-red;
text-decoration: none;
@include transition();
&:hover, &:focus {
color: darken($mit-red, 15%);
}
}
}
ul {
margin-bottom: 0;
li {
line-height: lh();
width: flex-grid(4, 8);
float: left;
margin-bottom: lh(.5);
&:nth-child(odd) {
margin-right: flex-gutter(8);
}
}
}
}
}
}
&.course, &.staff {
width: flex-grid(4);
h1 {
font: normal $body-font-size $body-font-family;
text-transform: uppercase;
letter-spacing: 1px;
color: #666;
margin-bottom: lh();
}
h2 {
font: 800 24px $header-font-family;
}
h3 {
font: 400 18px $header-font-family;
}
a {
@extend .button;
}
ul {
list-style: none;
li {
img {
float: left;
margin-right: lh(.5);
}
}
}
}
&.course {
h2 {
padding-top: lh(5);
background: url('/static/images/marketing/circuits-bg.jpg') 0 0 no-repeat;
@include background-size(contain);
@media screen and (max-width: 998px) {
background: url('/static/images/marketing/circuits-medium-bg.jpg') 0 0 no-repeat;
}
}
}
// index
//---------------------------------------- //
&.about-course {
@include box-sizing(border-box);
border-right: 1px solid #e5e5e5;
margin-right: flex-gutter();
padding-right: flex-gutter() / 2;
width: flex-grid(8);
section {
width: flex-grid(4, 8);
&.about-info {
margin-right: flex-gutter(8);
}
&.requirements {
clear: both;
width: 100%;
border-top: 1px solid #E5E5E5;
padding-top: lh();
margin-bottom: 0;
p {
float: left;
width: flex-grid(4, 8);
margin-right: flex-gutter(8);
&:nth-child(odd) {
margin-right: 0;
}
}
}
&.cta {
width: 100%;
text-align: center;
a.enroll {
@extend .button;
padding: lh(.5) lh(2);
@include inline-block();
text-align: center;
font: 800 18px $header-font-family;
}
}
}
}
}
}
section.copyright, section.tos, section.privacy-policy, section.honor-code {
@extend .subpage;
}
footer {
@extend .wrapper;
@extend .clearfix;
padding-top: 0;
div.footer-wrapper {
border-top: 1px solid #e5e5e5;
padding: lh() 0;
background: url('/static/images/marketing/mit-logo.png') right center no-repeat;
a {
color: #888;
text-decoration: none;
@include transition();
&:hover, &:focus {
color: #666;
}
}
p {
@include inline-block();
margin-right: lh();
}
ul {
@include inline-block();
li {
@include inline-block();
&:after {
content: ' |';
display: inline;
color: #ccc;
}
&:last-child {
&:after {
content: none;
}
}
}
}
}
}
sass/_info.scss
......@@ -3,37 +3,88 @@ div.info-wrapper {
section.updates {
@extend .content;
> h1 {
@extend .top-header;
}
> p {
margin-bottom: lh();
}
ol {
list-style: none;
li {
padding-bottom: lh(.5);
margin-bottom: lh(.5);
@extend .clearfix;
border-bottom: 1px solid #e3e3e3;
h2 {
float: left;
width: flex-grid(2, 9);
margin: 0 flex-gutter() 0 0;
}
p {
float: left;
width: flex-grid(7, 9);
margin-bottom: 0;
}
}
}
}
section.handouts {
@extend .sidebar;
@include border-radius(0px 4px 0px 4px);
@include border-radius(0 4px 4px 0);
border-right: 0;
border-left: 1px solid #d3d3d3;
h1 {
padding: 0 lh();
font-size: 18px;
}
ol {
list-style: none;
li {
h2 {
padding: 0 lh();
@include box-shadow(0 1px 0 #eee);
border-bottom: 1px solid #d3d3d3;
@extend .clearfix;
p {
padding: 7px lh();
margin: 0;
text-transform: none;
letter-spacing: 0;
font-size: $body-font-size;
&:hover {
background: #efefef;
}
a {
display: inline;
padding: 0;
&:hover {
text-decoration: underline;
background: none;
}
}
}
a {
@include box-shadow(0 1px 0 #eee);
@include transition();
border-bottom: 1px solid #d3d3d3;
color: lighten($text-color, 10%);
display: block;
padding: 7px lh();
text-decoration: none;
&:hover {
@include box-shadow(0 1px 0 #fff);
background: #efefef;
}
}
......
sass/_local.scss deleted 100644 → 0
#hide_acc {
min-height:600;
}
#mainblock {
border: 0;
padding: 0;
margin: 0;
width: 200;
min-height:600px;
margin-left: 276px;
margin-right: 0px;
}
.bordered { border: 1px solid #AAAAAA; border-style : dotted; }
.seq_problem_visited { background-color: #ccccaa;}
.seq_video_visited { background-color: #ccaacc;}
.seq_html_visited { background-color: #caaccc;}
.seq_tab_visited { background-color: #aacccc;}
.seq_vertical_visited { background-color: #acaccc;}
.seq_sequential_visited { background-color: #cacacc;}
.seq_problem_visited { background-color: #ccacac;}
.seq_schematic_visited { background-color: #cccaca;}
.seq_problem_inactive { background-color: #aaaa99;}
.seq_video_inactive { background-color: #aa99aa;}
.seq_video_inactive { background-color: #aaa99a;}
.seq_html_inactive { background-color: #a99aaa;}
.seq_tab_inactive { background-color: #99aaaa;}
.seq_vertical_inactive { background-color: #9a9aab;}
.seq_sequential_inactive { background-color: #a9a9aa;}
.seq_problem_inactive { background-color: #aa9a9a;}
.seq_schematic_inactive { background-color: #aaa9a9;}
.seq_active { background-color: red;}
sass/_profile.scss
......@@ -9,7 +9,8 @@ div.profile-wrapper {
border-right: 0;
h1 {
padding: lh();
padding:0 lh();
font-size: 18px;
}
ul {
......@@ -52,31 +53,54 @@ div.profile-wrapper {
section.course-info {
@extend .content;
ol {
> h1 {
@extend .top-header;
}
> ol {
list-style: none;
border-top: 1px solid #e3e3e3;
margin-top: lh();
> li {
border-bottom: 1px solid #e3e3e3;
padding: lh() 0;
width: 100%;
display: table;
@extend .clearfix;
h2 {
float: left;
display: table-cell;
padding: 0;
margin: 0;
width: flex-grid(2, 9);
margin-right: flex-gutter(9);
padding-right: flex-gutter(9);
border-right: 1px dotted #ccc;
@include box-sizing(border-box);
}
div.scores {
float: left;
ol.sections {
padding-left: flex-gutter(9);
display: table-cell;
list-style: none;
width: flex-grid(7, 9);
> li {
padding:0 0 lh() 0;
&:first-child {
padding-top: 0;
}
&:last-child {
border-bottom: 0;
}
h3 {
color: #666;
}
ul {
ol {
list-style: none;
li {
......@@ -84,6 +108,7 @@ div.profile-wrapper {
padding-right: 1em;
}
}
}
}
}
}
......
sass/_textbook.scss
......@@ -74,6 +74,13 @@ div.book-wrapper {
}
}
}
&.bottom-nav {
margin-top: lh();
margin-bottom: -(lh());
border-bottom: 0;
border-top: 1px solid #EDDFAA;
}
}
section.page {
......
sass/_theme.scss deleted 100644 → 0
/*
----------------------------------------------------------------------------------------
Copyright 2010 - Thierry Ruiz - www.dotemplate.com - All rights reserved.
THIS TEMPLATE IS FREE AS LONG AS YOU KEEP THE LINK TO WWW.DOTEMPLATE.COM IN THE FOOTER
TO REMOVE THE LINK, PLEASE MAKE A 10 DOLLARS DONATION at www.dotemplate.com/#donate
pmitros donated $10
Colors:
Light blue: bddeff
Blue: 7fbcfd
Very dark blue: #031634
Dark blue: #023063;
Dark Greenish: #7a994c;
Greenish: #adcc80;
Very light greenish: #dae5c9;
Bright orange: #fa720a;
----------------------------------------------------------------------------------------
*/
h1 {
clear:both;
}
h2 {
clear:both;
}
h3 {
font-size:1em;
margin:20px 0 5px 0;
clear:both;
}
#wrapper {
background: transparent url( images/css/page-vbg.jpg ) repeat-y scroll 50% 0px;
margin:0 auto ;
width:100%;
}
// marketing pages
#topWrapper {
width:100%;
height:100px;
background-image:url(images/css/topWrapper-bg.jpg);
background-position:center top ;
background-repeat:repeat-x;
}
#topBanner {
width:800px;
margin:0 auto;
height:100px;
background-image:url(images/css/topBanner.jpg);
background-repeat:no-repeat;
}
#topnav {
background:transparent url('images/css/hmenu.jpg') repeat-x top left;
height:20px;
margin:0 auto ;
text-align:center;
width:800px;
ul {
display:table;
margin:0 auto;
padding:0;
list-style-type:none;
position:relative;
height:20px;
text-transform:uppercase;
font-size:0.9em;
font-family:Arial,sans-serif;
li {
display:block;
float:left;
margin:0;
padding:0;
background:transparent url('images/css/hmenu.jpg') repeat-x top left;
a {
display:block;
float:left;
color:#031634;
text-decoration:none;
padding:0px 50px ;
line-height:20px;
font-weight:bold;
}
}
}
}
#topnav ul li a:hover, #topnav li#current a {
color:#7a994c;
background:transparent url('images/css/hmenu-sel.jpg') repeat-x top left;
}
#bg {
margin:0 auto;
padding:0;
background:transparent ;
background-image:url(images/css/hat.jpg);
background-repeat:no-repeat;
background-position: center top ;
}
#header {
margin: 0 auto;
min-height:0px;
height: 0px;
width: 800px;
}
#page {
background: transparent url( images/css/page-bg.jpg ) no-repeat center top;
}
#container {
margin:0 auto;
width:800px;
}
#content {
width:780px;
margin:0 auto ;
text-align:left;
min-height:800px;
}
#content p {
text-align:justify;
}
#footerWrapper {
margin:0 auto;
height:10px;
padding:0;
background:transparent url( images/css/footerWrapper-bg.jpg ) no-repeat scroll center top;
}
#footer {
margin:0 auto;
padding:0;
width:800px;
height:10px;
}
#sidebar ul.vmenu {
list-style: none;
text-align: left;
margin: 7px 0px 8px 0px;
padding: 0;
text-decoration: none;
border-top: 1px solid #eeeeee;
}
#sidebar ul.vmenu li {
list-style: none;
padding: 4px 0 4px 0px;
margin: 0 2px;
border-bottom: 1px solid #eeeeee;
}
#sidebar ul.vmenu li a {
text-decoration: none;
color:#023063;
}
#sidebar ul.vmenu li a:hover {
color:#adcc80;
}
#sidebar ul.vmenu ul { margin: 0 0 0 5px; padding: 0; }
#sidebar ul.vmenu ul li { border: none; }
sass/application.scss
@import "bourbon/bourbon";
@import "reset";
@import "font-face";
// Base layout
@import "base-variables", "base-extends", "base";
@import "layout";
@import "leanmodal";
@import "base/reset", "base/font-face";
@import "base/variables", "base/functions", "base/extends", "base/base";
@import "layout/layout", "layout/header", "layout/footer", "layout/leanmodal";
@import "jquery-ui-1.8.16.custom";
// pages
@import "courseware", "courseware-video", "courseware-sequence-nav";
@import "courseware/courseware", "courseware/sidebar", "courseware/video", "courseware/sequence-nav";
@import "textbook";
@import "info";
@import "profile";
@import "wiki-basic-html", "wiki-create", "wiki";
@import "activation";
@import "wiki/basic-html", "wiki/sidebar", "wiki/create", "wiki/wiki";
@import "help";
@import "askbot-original", "discussion", "discussion-questions", "discussion-tags", "question-view" , "discussion-answers", "discussion-forms", "form-wmd-toolbar";
// left over
// @import "theme";
// @import "local";
@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";
sass/_base.scss → sass/base/_base.scss
......@@ -29,6 +29,11 @@ em {
font-style: italic;
}
img {
max-width: 100%;
height: auto;
}
#{$all-text-inputs}, textarea {
@include box-shadow(0 -1px 0 #fff);
@include linear-gradient(#eee, #fff);
......
sass/_base-extends.scss → sass/base/_extends.scss
......@@ -19,6 +19,13 @@
}
}
h1.top-header {
margin: (-(lh())) (-(lh())) lh();
padding: lh();
background: #f3f3f3;
border-bottom: 1px solid #e3e3e3;
}
.button {
@include box-shadow(inset 0 1px 0 lighten(#888, 10%), 0 0 3px #ccc);
@include linear-gradient(lighten(#888, 5%), darken(#888, 5%));
......@@ -29,6 +36,8 @@
font: bold $body-font-size $body-font-family;
cursor: pointer;
-webkit-font-smoothing: antialiased;
text-shadow: none;
text-decoration: none;
&:hover, &:focus {
@include box-shadow(inset 0 1px 0 lighten(#888, 20%), 0 0 3px #ccc);
......@@ -100,6 +109,10 @@
}
}
}
a.button {
text-decoration: none;
}
}
.topbar {
......
sass/_index-functions.scss → sass/base/_functions.scss
// Functions
//---------------------------------------- //
// Flexible grid
@function flex-grid($columns, $container-columns: $fg-max-columns) {
$width: $columns * $fg-column + ($columns - 1) * $fg-gutter;
......@@ -14,8 +11,12 @@
@return percentage($gutter / $container-width);
}
// Percentage of container calculator
@function perc($width, $container-width: $max-width) {
@return percentage($width / $container-width);
}
// Line-height
@function lh($amount: 1) {
@return $lh * $amount;
@return $body-line-height * $amount;
}
sass/_base-variables.scss → sass/base/_variables.scss
// Flexible grid
@function flex-grid($columns, $container-columns: $fg-max-columns) {
$width: $columns * $fg-column + ($columns - 1) * $fg-gutter;
$container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter;
@return percentage($width / $container-width);
}
// Flexible grid gutter
@function flex-gutter($container-columns: $fg-max-columns, $gutter: $fg-gutter) {
$container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter;
@return percentage($gutter / $container-width);
}
// Percentage of container calculator
@function perc($width, $container-width: $max-width) {
@return percentage($width / $container-width);
}
// Line-height
@function lh($amount: 1) {
@return $body-line-height * $amount;
}
// Variables
// ---------------------------------------- //
......
sass/bourbon/_bourbon.scss
// Custom Functions
@import "functions/deprecated-webkit-gradient";
@import "functions/golden-ratio";
@import "functions/grid-width";
@import "functions/modular-scale";
@import "functions/tint-shade";
// CSS3 Mixins
......
sass/bourbon/addons/_font-family.scss
$georgia: Georgia, Cambria, "Times New Roman", Times, serif;
$helvetica: "Helvetica Neue", Helvetica, Arial, sans-serif;
$lucida-grande: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
$monospace: "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
$verdana: Verdana, Geneva, sans-serif;
sass/bourbon/css3/_animation.scss
// http://www.w3.org/TR/css3-animations/#the-animation-name-property-
// Each of these mixins support comma separated lists of values, which allows different transitions for individual properties to be described in a single style rule. Each value in the list corresponds to the value at that same position in the other properties.
// Official animation shorthand property.
@mixin animation ($animation-1,
$animation-2: false, $animation-3: false,
$animation-4: false, $animation-5: false,
$animation-6: false, $animation-7: false,
$animation-8: false, $animation-9: false)
{
$full: compact($animation-1, $animation-2, $animation-3, $animation-4,
$animation-5, $animation-6, $animation-7, $animation-8, $animation-9);
-webkit-animation: $full;
-moz-animation: $full;
animation: $full;
}
// Individual Animation Properties
@mixin animation-name ($name-1,
$name-2: false, $name-3: false,
$name-4: false, $name-5: false,
......@@ -127,8 +143,7 @@
}
// Shorthand for a basic animation. Supports multiple parentheses-deliminated values for each variable.
// Example: @include animation-basic((slideup, fadein), (1.0s, 2.0s), ease-in);
// Deprecated
@mixin animation-basic ($name, $time: 0, $motion: ease) {
$length-of-name: length($name);
$length-of-time: length($time);
......@@ -151,11 +166,6 @@
} @else {
@include animation-timing-function( $motion);
}
@warn "The animation-basic mixin is deprecated. Use the animation mixin instead.";
}
// Official animation shorthand property. Needs more work to actually be useful.
@mixin animation ($name, $duration, $timing-function, $delay, $iteration-count, $direction) {
-webkit-animation: $name $duration $timing-function $delay $iteration-count $direction;
-moz-animation: $name $duration $timing-function $delay $iteration-count $direction;
animation: $name $duration $timing-function $delay $iteration-count $direction;
}
sass/bourbon/css3/_linear-gradient.scss
......@@ -2,7 +2,8 @@
$G3: false, $G4: false,
$G5: false, $G6: false,
$G7: false, $G8: false,
$G9: false, $G10: false) {
$G9: false, $G10: false,
$fallback: false) {
// Detect what type of value exists in $pos
$pos-type: type-of(nth($pos, 1));
......@@ -15,7 +16,15 @@
$full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
background-color: nth($G1, 1);
// Set $G1 as the default fallback color
$fallback-color: nth($G1, 1);
// If $fallback is a color use that color as the fallback color
@if type-of($fallback) == color {
$fallback-color: $fallback;
}
background-color: $fallback-color;
background-image: deprecated-webkit-gradient(linear, $full); // Safari <= 5.0
background-image: -webkit-linear-gradient($pos, $full); // Safari 5.1+, Chrome
background-image: -moz-linear-gradient($pos, $full);
......@@ -27,5 +36,6 @@
// Usage: Gradient position is optional, default is top. Position can be a degree. Color stops are optional as well.
// @include linear-gradient(#1e5799, #2989d8);
// @include linear-gradient(#1e5799, #2989d8, $fallback:#2989d8);
// @include linear-gradient(top, #1e5799 0%, #2989d8 50%);
// @include linear-gradient(50deg, rgba(10, 10, 10, 0.5) 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
sass/bourbon/functions/_golden-ratio.scss → sass/bourbon/functions/_modular-scale.scss
@function golden-ratio($value, $increment) {
@function modular-scale($value, $increment, $ratio) {
@if $increment > 0 {
@for $i from 1 through $increment {
$value: ($value * 1.618);
$value: ($value * $ratio);
}
}
@if $increment < 0 {
$increment: abs($increment);
@for $i from 1 through $increment {
$value: ($value / 1.618);
$value: ($value / $ratio);
}
}
......@@ -16,16 +16,25 @@
}
// div {
// Increment Up GR with positive value
// font-size: golden-ratio(14px, 1); // returns: 22.652px
// Increment Up GR with positive value
// font-size: modular-scale(14px, 1, 1.618); // returns: 22.652px
//
// Increment Down GR with negative value
// font-size: golden-ratio(14px, -1); // returns: 8.653px
// Increment Down GR with negative value
// font-size: modular-scale(14px, -1, 1.618); // returns: 8.653px
//
// Can be used with ceil(round up) or floor(round down)
// font-size: floor( golden-ratio(14px, 1) ); // returns: 22px
// font-size: ceil( golden-ratio(14px, 1) ); // returns: 23px
// font-size: floor( modular-scale(14px, 1, 1.618) ); // returns: 22px
// font-size: ceil( modular-scale(14px, 1, 1.618) ); // returns: 23px
// }
//
// modularscale.com
@function golden-ratio($value, $increment) {
@return modular-scale($value, $increment, 1.618)
}
// div {
// font-size: golden-ratio(14px, 1); // returns: 22.652px
// }
//
// goldenratiocalculator.com
sass/bourbon/lib/bourbon.rb
require "bourbon/generator"
module Bourbon
if defined?(Rails)
class Engine < ::Rails::Engine
......
sass/_courseware.scss → sass/courseware/_courseware.scss
......@@ -5,87 +5,17 @@ div.course-wrapper {
list-style: none;
}
div#accordion {
@extend .sidebar;
div#open_close_accordion {
position: absolute;
right: 0px;
width: 20px;
height: 20px;
background: #ccc;
border: 1px solid black;
right: -22px;
top: 5px;
}
h3 {
overflow: hidden;
margin: 0;
&:last-child {
@include box-shadow(none);
}
&.ui-accordion-header {
color: #000;
a {
font-size: $body-font-size;
color: lighten($text-color, 10%);
}
&.ui-state-hover {
border: none;
border-bottom: 1px solid #d3d3d3;
}
&.ui-state-active {
@extend .active;
}
}
}
ul.ui-accordion-content {
@include border-radius(0);
@include box-shadow( inset -1px 0 0 #e6e6e6);
background: #d6d6d6;
border: none;
border-bottom: 1px solid #c3c3c3;
font-size: 12px;
margin: 0;
overflow: hidden;
li {
&.active {
font-weight: bold;
}
a {
text-decoration: none;
margin-bottom: lh(.5);
display: block;
color: #000;
&:hover {
color: #666;
}
p {
margin-bottom: 0;
&.subtitle {
color: #666;
}
}
}
}
}
.tran {
@include transition( all, .2s, $ease-in-out-quad);
}
section.course-content {
@extend .content;
h1 {
@extend .top-header;
}
p {
margin-bottom: lh();
......@@ -95,6 +25,12 @@ div.course-wrapper {
}
}
ul {
li {
margin-bottom: lh(.5);
}
}
.problem-set {
position: relative;
@extend .clearfix;
......@@ -180,7 +116,6 @@ div.course-wrapper {
}
}
section.problems-wrapper, div#seq_content {
@extend .problem-set;
}
......@@ -195,8 +130,17 @@ div.course-wrapper {
}
}
div#seq_content {
h1 {
background: none;
margin-bottom: 0;
padding-bottom: 0;
border-bottom: none;
}
}
ol.vert-mod {
> li {
> li {
@extend .clearfix;
@extend .problem-set;
border-bottom: 1px solid #ddd;
......@@ -211,4 +155,34 @@ div.course-wrapper {
}
}
}
&.closed {
section.course-index {
width: flex-grid(.6);
div#open_close_accordion {
padding: 0;
a {
background-image: url('/static/images/slide-right-icon.png');
}
h2 {
visibility: hidden;
width: 10px;
padding: 0;
}
}
div#accordion {
visibility: hidden;
width: 10px;
padding: 0;
}
}
section.course-content {
width: flex-grid(11.5) + flex-gutter();
}
}
}
sass/courseware/_sidebar.scss 0 → 100644
section.course-index {
@extend .sidebar;
@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 {
h3 {
overflow: hidden;
margin: 0;
&:last-child {
@include box-shadow(none);
}
&.ui-accordion-header {
color: #000;
a {
font-size: $body-font-size;
color: lighten($text-color, 10%);
}
&.ui-state-hover {
border: none;
border-bottom: 1px solid #d3d3d3;
}
&.ui-state-active {
@extend .active;
}
}
}
ul.ui-accordion-content {
@include border-radius(0);
@include box-shadow( inset -1px 0 0 #e6e6e6);
background: #d6d6d6;
border: none;
border-bottom: 1px solid #c3c3c3;
font-size: 12px;
margin: 0;
overflow: hidden;
li {
&.active {
font-weight: bold;
}
a {
text-decoration: none;
margin-bottom: lh(.5);
display: block;
color: #000;
&:hover {
color: #666;
}
p {
margin-bottom: 0;
&.subtitle {
color: #666;
}
}
}
}
}
}
}
sass/_courseware-video.scss → sass/courseware/_video.scss
......@@ -88,6 +88,7 @@ section.course-content {
li {
float: left;
margin-bottom: 0;
a {
@include box-shadow(1px 0 0 #555);
......
sass/_discussion-answers.scss → sass/discussion/_answers.scss
div.answer-controls {
@include box-sizing(border-box);
@extend div.question-controls;
display: inline-block;
margin: 20px 0;
margin: 0 0 15px;
padding-left: flex-grid(1.1);
width: 100%;
div.answer-sort {
@extend div.question-sort;
div.answer-count {
display: inline-block;
float: left;
}
div.answer-count {
@extend div.question-count;
div.answer-sort {
float: right;
margin-left: flex-gutter();
nav {
@extend .action-link;
float: right;
margin-top: 34px;
a {
&.on span{
font-weight: bold;
}
&:before {
content: '|';
color: darken(#F6EFD4, 10%);
font-size: 16px;
}
}
}
}
}
......@@ -44,7 +64,48 @@ div.answer-block {
}
div.answered-by-owner {
color: darken($mit-red, 20%);
p {
font-style: italic;
color: #656565;
}
div.comments-container {
color: #555;
}
}
div.deleted {
p {
color: $mit-red;
}
}
}
div.paginator {
@extend div.answer-block;
text-align: center;
padding: 20px 0;
span {
@include border-radius(3px);
background: #eee;
margin: 0 5px;
padding: 4px 10px;
&.curr {
background: none;
color: $mit-red;
font-weight: bold;
}
&.next, &.prev {
@extend .light-button;
}
a {
color: #555;
text-decoration: none;
}
}
}
......@@ -56,17 +117,27 @@ div.answer-own {
}
div.answer-actions {
text-align: right;
margin: 0;
padding: 0;
padding:8px 8px 8px 0;
text-align: right;
border-top: 1px solid #efefef;
span.sep {
color: #ddd;
color: #EDDFAA;
}
a {
cursor: pointer;
text-decoration: none;
&.question-delete {
color: $mit-red;
}
&.question-edit, &.permant-link {
color: darken(#F6EFD4, 45%);;
}
}
a.question-edit, a.permant-link {
color: #999;
}
}
sass/_discussion.scss → sass/discussion/_discussion.scss
......@@ -16,74 +16,21 @@
border: 1px solid #ccc;
text-decoration: none;
}
}
// Layout
body.askbot {
.secondary-nav {
margin: 0;
nav {
@extend .clearfix;
@extend .topbar;
@extend .wrapper;
@include box-sizing(border-box);
border: 1px solid darken(#F6EFD4, 10%);
border-top: 0;
margin: 0 auto;
padding: $body-line-height;
div {
float: left;
&.question-filter {
font-size:16px;
margin-top: 4px;
width: flex-grid(4);
ul {
@include border-radius(35px);
background: darken(#F6EFD4, 20%);
display: inline;
margin: 0 0 0 10px;
padding: $body-line-height/4 20px;
li {
display: inline-block;
list-style: none;
margin-right: 10px;
&:last-child {
margin-right: 0;
}
a {
text-transform: capitalize;
text-shadow: none;
font-size: 14px;
&.on {
font-weight: bold;
}
}
}
}
}
&.search-box {
margin-left:2%;
text-align:right;
width: flex-grid(8);
input[type="text"] {
margin-right: 6px;
width: flex-grid(2,8);
}
}
}
.action-link {
a {
color: darken(#F6EFD4, 50%);
}
&:hover {
text-decoration: none;
color: darken(#F6EFD4, 70%);
}
}
}
// Layout
body.askbot {
section.main-content {
div.discussion-wrapper {
......@@ -92,18 +39,21 @@ body.askbot {
div.discussion-content {
@include box-sizing(border-box);
display: table-cell;
padding: $gw-gutter;
padding: lh();
vertical-align: top;
width: flex-grid(9);
width: flex-grid(9) + flex-gutter();
p.tabula-rasa {
.tabula-rasa {
@extend .light-button;
@include border-radius(5px);
background-color: #f6f6f6;
color: #888;
display: block;
margin: 10px auto;
padding: 20px;
text-align: center;
width: flex-grid(5);
text-decoration: none;
color: #888;
font-weight: bold;
&:first-child {
margin-top: 70px;
......@@ -112,54 +62,14 @@ body.askbot {
margin-bottom: 70px;
}
a {
text-decoration: none;
color: #888;
font-weight: bold;
}
}
}
aside {
@extend .sidebar;
@include box-shadow(inset 1px 0 0 #f6f6f6);
border-left: 1px solid #d3d3d3;
border-right: 1px solid #f6f6f6;
padding: $gw-gutter;
width: flex-grid(3);
h2 {
font-size: 16px;
}
h3 {
border-bottom: 0;
box-shadow: none;
}
input[type="text"] {
width: 76%;
}
#displayTagFilterControl {
margin-top: 10px;
// span, a {
// text-decoration: none;
// color: #888;
// font-weight: bold;
// }
}
}
}
}
footer {
margin: 0 auto;
padding: 0;
div.footer-wrapper {
@extend .clearfix;
@extend .wrapper;
@include box-shadow(0 1px 0 #fff);
@include box-sizing(border-box);
background-color: #000;
border-top: 0;
padding: $gw-gutter/2;
}
}
}
sass/_form-wmd-toolbar.scss → sass/discussion/_form-wmd-toolbar.scss
......@@ -3,7 +3,7 @@
}
#wmd-button-bar {
background: url(static/images/askbot/editor-toolbar-background.png) repeat-x bottom;
background: url(/static/images/askbot/editor-toolbar-background.png) repeat-x bottom;
border: 1px solid #ddd;
height:36px;
float:left;
......
sass/_discussion-forms.scss → sass/discussion/_forms.scss
......@@ -13,17 +13,27 @@ form.answer-form {
}
div.form-item {
margin: 25px 0;
margin: 15px 0;
label {
display: block;
margin-bottom: -5px;
}
.title-desc {
@include box-sizing(border-box);
background: #333;
color: #fff;
font-size: 13px;
padding: 5px 10px;
width: flex-grid(6);
-webkit-font-smoothing: antialiased;
}
}
span.form-error, label.form-error {
color: #990000;
display: inline;
display: inline-block;
font-size: 90%;
font-weight: bold;
padding: 10px 0;
......@@ -73,7 +83,12 @@ form.question-form {
padding: 0;
margin-top: -15px;
h1 a {
float: right;
}
input[type="text"] {
@include box-sizing(border-box);
width: flex-grid(6);
}
......
sass/discussion/_modals.scss 0 → 100644
.vote-notification {
background-color: darken($mit-red, 7%);
@include border-radius(4px);
@include box-shadow(0px 2px 9px #aaa);
color: white;
cursor: pointer;
display: none;
font-size: 14px;
font-weight: normal;
padding-bottom: 10px;
position: absolute;
text-align: center;
h3 {
background: $mit-red;
padding: 10px 10px 10px 10px;
font-size: 13px;
margin-bottom: 5px;
border-bottom: darken(#8e0000, 10%) 1px solid;
@include box-shadow(0 1px 0 lighten($mit-red, 10%));
color: #fff;
font-weight: normal;
@include border-radius(4px 4px 0 0);
}
a {
color: #fb7321;
text-decoration: underline;
font-weight: bold; } }
sass/discussion/_profile.scss 0 → 100644
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 {
h1 {
@extend .top-header;
}
}
ul.sub-info {
border-top: 1px solid #ddd;
margin-top: lh();
list-style: none;
> li {
width: flex-grid(2.25, 9);
display: table-cell;
padding: (flex-gutter(9)/2);
border-right: 1px solid #ddd;
@include box-sizing(border-box);
&:first-child {
padding-left: 0;
}
&:last-child {
border-right: 0;
padding-right: 0;
}
h2 {
margin-top: 0;
}
span.tag-number {
display: none;
}
}
ul {
list-style: none;
&.user-stats-table {
list-style: none;
}
&.vote-buttons {
list-style: none;
li {
@include border-radius(4px);
background-color: lighten(#F6EFD4, 3%);
background-position: 10px center;
background-repeat: no-repeat;
height: 20px;
padding: 10px 10px 10px 40px;
display: inline-block;
&.up {
background-image: url(/static/images/askbot/vote-arrow-up.png);
margin-right: 6px;
}
&.down {
background-image: url(/static/images/askbot/vote-arrow-down.png);
}
}
}
&.badges {
@include border-radius(4px);
background-color: #e3e3e3;
@include inline-block();
a {
border: 0;
background: none;
text-transform: uppercase;
color: #292309;
font-size: 12px;
padding: 10px;
text-shadow: 0 1px 0 #fff;
display: block;
}
}
}
}
}
sass/_question-view.scss → sass/discussion/_question-view.scss
......@@ -93,17 +93,17 @@ div.question-header {
float: left;
margin-right: flex-gutter(8);
width: flex-grid(6.2,8);
}
div.post-update-container {
display: inline-block;
float: left;
width: flex-grid(1.8,8);
border-left: 1px dotted #CCC;
div.post-update-info {
@include box-sizing(border-box);
@include border-radius(5px);
background:lighten(#F6EFD4, 5%);
padding: 10px;
margin-bottom: 10px;
......@@ -126,29 +126,19 @@ div.question-header {
div.change-date {
font-size: 12px;
margin-bottom: 10px;
margin-bottom: 2px;
}
div.avatar {
div.user-meta {
display: inline-block;
float: left;
margin-right: 3px;
img.gravatar {
background: white;
border: 1px solid darken(#F6EFD4, 10%);
span.username {
font-size: 20px;
margin-right: 5px;
padding: 3px ;
vertical-align: bottom;
}
}
div.user-meta {
display: inline-block;
width: 60%;
span.user-badges {
display: block;
// display: block;
}
}
}
......@@ -157,10 +147,8 @@ div.question-header {
div.comments-container {
@include box-sizing(border-box);
// background: lighten(#efefef, 3%);
padding: 3%;
display: inline-block;
// margin: 15px 0 0;
padding: 3%;
width: 100%;
......@@ -176,9 +164,6 @@ div.question-header {
&:first-child {
border-top: 0;
}
// &:last-child {
// border-bottom: 1px solid #ddd;
// }
}
form.post-comments {
......@@ -310,4 +295,18 @@ div.question-header {
}
}
div.question-status {
background: $mit-red;
clear:both;
color: #fff;
display: block;
padding: 10px 0 10px 7.5%;
h3 {
font-weight: normal;
}
a {
color: #eee;
}
}
sass/_discussion-questions.scss → sass/discussion/_questions.scss
div.question-controls {
div.question-list-header {
display: block;
margin-bottom: 30px;
margin-bottom: 15px;
overflow: hidden;
width: flex-grid(9,9);
div {
display: inline-block;
}
section.question-list-meta {
display: block;
overflow: hidden;
width: 100%;
div.question-count {
margin-right: flex-gutter();
width: flex-grid(4,9);
div {
display: inline-block;
float: left;
}
h1 {
margin-top: 0;
span.label {
color: #555;
}
div.question-list-title {
margin-right: flex-gutter();
h1 {
margin-top: 0;
}
}
}
div.question-sort {
vertical-align: bottom;
width: flex-grid(5,9);
nav {
@include border-radius(35px);
background-color: lighten(#F6EFD4, 5%) ;
height: 30px;
div.question-sort {
float: right;
font-size: 16px;
margin: 3px 0;
padding:0px 20px 5px;
margin-left: flex-gutter();
margin-top: 10px;
a {
color: darken(#F6EFD4, 50%);
nav {
@extend .action-link;
float: right;
&.on span{
font-weight: bold;
}
a {
&.on span{
font-weight: bold;
}
&:before {
content: '|';
color: darken(#F6EFD4, 10%);
font-size: 22px;
&:before {
content: '|';
color: darken(#F6EFD4, 10%);
font-size: 16px;
}
}
}
}
}
&:hover {
text-decoration: none;
color: darken(#F6EFD4, 70%);
}
section.question-tags-list {
display: block;
min-height: 26px;
overflow: hidden;
padding-top:5px;
width: 100%;
div {
display: inline-block;
float: left;
}
div.back {
margin-right: 10px;
a {
color: #555;
}
}
div.tags-list {
}
}
}
ul.question-list {
ul.question-list, div#question-list {
width: flex-grid(9,9);
li.single-question {
......@@ -61,7 +86,7 @@ ul.question-list {
padding: 10px 0;
&:hover {
background: lighten(#F6EFD4, 8%);
background: #fbfbfb;
}
div {
......@@ -75,7 +100,7 @@ ul.question-list {
h2 {
font-size: 16px;
font-weight: normal;
font-weight: bold;
margin: 0px 0 15px 0;
text-transform: none;
}
......@@ -106,27 +131,31 @@ ul.question-list {
text-align: right;
li {
@include border-radius(3px);
@include linear-gradient(#fff, #f5f5f5);
border: 1px solid #eee;
display: inline-block;
height:60px;
margin-right: 10px;
width: 60px;
&:hover {
span, div {
color: #555;
}
}
&.views {
background: lighten(#F6EFD4, 5%);
}
&.answers {
background: #F6EFD4;
}
&.votes {
background: darken(#F6EFD4, 5%);
}
span, div {
@include box-sizing(border-box);
color: darken(#F6EFD4, 60%);
color: #888;
display: block;
text-align: center;
}
......@@ -149,10 +178,15 @@ ul.question-list {
}
}
}
div.search-tips {
display: block;
div.post-own-question {
border-top: 1px solid #efefef;
padding: 10px;
a {
font-weight: bold;
}
}
}
.search-result-summary {
......
sass/discussion/_sidebar.scss 0 → 100644
div.discussion-wrapper aside {
@extend .sidebar;
@include box-shadow(inset 1px 0 0 #f6f6f6);
@include border-radius(0 4px 4px 0);
border-left: 1px solid #d3d3d3;
border-right: 1px solid #f6f6f6;
padding: lh();
width: flex-grid(3);
h2 {
color: #4D4D4D;
&.first {
margin-top: 0px;
}
}
h3 {
border-bottom: 0;
box-shadow: none;
}
input[type="text"] {
width: 76%;
}
div.box {
@include box-shadow(0 1px 0 #eee);
border-bottom: 1px solid #d3d3d3;
display: block;
padding-bottom: 20px;
overflow: hidden;
&:last-child {
@include box-shadow(none);
border: 0;
}
&.contributors {
a {
@include border-radius(3px);
border: 1px solid #aaa;
cursor: pointer;
display: inline-block;
margin-right: 6px;
position: relative;
&:before {
@include border-radius(3px);
@include box-shadow(inset 0 0 1px 1px rgba(255,255,255,.4));
top: 1px; left: 1px; bottom: 1px; right: 1px;
content: '';
position: absolute;
}
}
img.gravatar {
@include border-radius(3px);
}
}
&.tag-selector {
ul {
margin-bottom: 10px;
display: block;
}
}
}
#displayTagFilterControl {
margin-top: 10px;
}
div.search-box {
input {
@include box-sizing(border-box);
display: inline;
}
input[type='submit'] {
@include box-shadow(none);
opacity: 0.5;
background: url(/static/images/askbot/search-icon.png) no-repeat center;
border: 0;
margin-left: 3px;
position: absolute;
text-indent: -9999px;
width: 24px;
&:hover {
opacity: 0.9;
}
&:focus {
opacity: 1;
}
}
input#keywords {
padding-left: 30px;
padding-right: 30px;
width: 100%;
}
input#clear {
@include box-shadow(none);
@include border-radius(15px);
border: none;
background: #bbb;
color: #fff;
display: inline;
font-size: 10px;
margin-left: -25px;
padding: 2px 5px;
}
}
// Question view sopecific
div.follow-buttons {
margin-top: 20px;
display: block;
a.button {
@include box-sizing(border-box);
display: block;
text-align: center;
width: 100%;
}
}
div.question-stats {
ul {
color: #777;
li {
@include box-shadow(0 1px 0 #eee);
border-bottom: 1px solid #d3d3d3;
padding: 7px 0;
&:last-child {
@include box-shadow(none);
border: 0;
}
strong {
float: right;
padding-right: 10px;
}
}
}
}
div.markdown ul li {
margin: 20px 0;
ol li {
margin: 0;
}
}
}
sass/_discussion-tags.scss → sass/discussion/_tags.scss
ul.tags {
list-style: none;
display: inline;
li, a {
position: relative;
}
li {
@include border-radius(4px);
background: #eee;
@include border-radius(4px);
@include box-shadow(1px 1px 0px #bbb);
color: #555;
display: inline;
display: inline-block;
font-size: 12px;
margin-bottom: 5px;
margin-left: 15px;
padding: 3px 10px 5px 5px;
&:before {
border-color:transparent #eee transparent transparent;
border-style:solid;
border-width:12px 12px 12px 0;
content:"";
height:0;
left:-10px;
position:absolute;
top:0;
left:-11px;
width:0;
height:0;
border-color:transparent #eee transparent transparent;
border-style:solid;
border-width:12px 12px 12px 0;
}
span.delete-icon, div.delete-icon {
background: #555;
@include border-radius(0 4px 4px 0);
clear: none;
color: #eee;
cursor: pointer;
display: inline;
float: none;
left: 10px;
opacity: 0.5;
padding: 3px 6px;
position: relative;
top: 1px;
&:hover {
opacity: 1;
}
}
a {
color: #555;
text-decoration: none;
}
}
}
span.tag-number {
display: none;
// @include border-radius(3px);
// background: #555;
// font-size: 10px;
// margin: 0 3px;
// padding: 2px 5px;
// color: #eee;
// opacity: 0.5;
}
sass/index/_base.scss 0 → 100644
body {
background-color: #fff;
color: #444;
font: $body-font-size $body-font-family;
:focus {
outline-color: #ccc;
}
h1 {
font: 800 24px $header-font-family;
}
li {
margin-bottom: lh();
}
em {
font-style: italic;
}
a {
color: $mit-red;
font-style: italic;
text-decoration: none;
&:hover, &:focus {
color: darken($mit-red, 10%);
}
}
#{$all-text-inputs}, textarea {
@include box-shadow(0 -1px 0 #fff);
@include linear-gradient(#eee, #fff);
border: 1px solid #999;
font: $body-font-size $body-font-family;
padding: 4px;
width: 100%;
&:focus {
border-color: $mit-red;
}
}
}
sass/_index-extends.scss → sass/index/_extends.scss
......@@ -2,7 +2,7 @@
@include box-sizing(border-box);
margin: 0 auto;
max-width: $fg-max-width;
min-width: $fg-min-width;
// min-width: $fg-min-width;
padding: lh();
width: flex-grid(12);
}
......@@ -14,8 +14,13 @@
> div {
padding-left: flex-grid(4) + flex-gutter();
@media screen and (max-width: 940px) {
padding-left: 0;
}
p {
margin-bottom: lh();
line-height: lh();
}
h1 {
......@@ -33,6 +38,15 @@
li {
list-style: disc outside none;
line-height: lh();
}
}
dl {
margin-bottom: lh();
dd {
margin-bottom: lh(.5);
}
}
}
......
sass/index/_footer.scss 0 → 100644
footer {
@extend .wrapper;
@extend .clearfix;
padding-top: 0;
div.footer-wrapper {
border-top: 1px solid #e5e5e5;
padding: lh() 0;
background: url('/static/images/marketing/mit-logo.png') right center no-repeat;
@media screen and (max-width: 780px) {
background-position: left bottom;
padding-bottom: lh(3);
}
a {
color: #888;
text-decoration: none;
@include transition();
&:hover, &:focus {
color: #666;
}
}
p {
@include inline-block();
margin-right: lh();
}
ul {
@include inline-block();
@media screen and (max-width: 780px) {
margin-top: lh();
}
li {
@include inline-block();
margin-bottom: 0;
&:after {
content: ' |';
display: inline;
color: #ccc;
}
&:last-child {
&:after {
content: none;
}
}
}
}
}
}
sass/index/_header.scss 0 → 100644
header.announcement {
@include background-size(cover);
background: #333;
border-bottom: 1px solid #000;
color: #fff;
-webkit-font-smoothing: antialiased;
&.home {
background: #e3e3e3 url("/static/images/marketing/shot-5-medium.jpg");
@media screen and (min-width: 1200px) {
background: #e3e3e3 url("/static/images/marketing/shot-5-large.jpg");
}
div {
padding: lh(10) lh() lh(3);
@media screen and (max-width:780px) {
padding: lh(2.5) lh() lh(2);
}
//hide login link for homepage
nav {
h1 {
margin-right: 0;
}
a.login {
display: none;
}
}
}
}
&.course {
background: #e3e3e3 url("/static/images/marketing/course-bg-small.jpg");
@media screen and (min-width: 1200px) {
background: #e3e3e3 url("/static/images/marketing/course-bg-large.jpg");
}
@media screen and (max-width: 1199px) and (min-width: 700px) {
background: #e3e3e3 url("/static/images/marketing/course-bg-medium.jpg");
}
div {
padding: lh(4) lh() lh(2);
@media screen and (max-width:780px) {
padding: lh(2.5) lh() lh(2);
}
}
}
div {
@extend .wrapper;
position: relative;
nav {
position: absolute;
top: 0;
right: lh();
@include border-radius(0 0 3px 3px);
background: #333;
background: rgba(#000, .7);
padding: lh(.5) lh();
h1 {
@include inline-block();
margin-right: lh(.5);
a {
font: italic 800 18px $header-font-family;
color: #fff;
text-decoration: none;
&:hover, &:focus {
color: #999;
}
}
}
a.login {
text-decoration: none;
color: #fff;
font-size: 12px;
font-style: normal;
font-family: $header-font-family;
&:hover, &:focus {
color: #999;
}
}
}
section {
@extend .clearfix;
background: $mit-red;
@include inline-block();
margin-left: flex-grid(4) + flex-gutter();
padding: lh() lh(1.5);
@media screen and (max-width: 780px) {
margin-left: 0;
}
h1 {
font-family: "Open Sans";
font-size: 30px;
font-weight: 800;
@include inline-block();
line-height: 1.2em;
margin: 0 lh() 0 0;
}
h2 {
font-family: "Open Sans";
font-size: 24px;
font-weight: 400;
@include inline-block();
line-height: 1.2em;
}
&.course {
section {
float: left;
margin-left: 0;
margin-right: flex-gutter(8);
padding: 0;
width: flex-grid(4, 8);
@media screen and (max-width: 780px) {
float: none;
width: 100%;
margin-right: 0;
}
a {
@extend .button;
background-color: darken($mit-red, 20%);
border-color: darken($mit-red, 30%);
@include box-shadow(inset 0 1px 0 darken($mit-red, 10%), 0 1px 0 lighten($mit-red, 5%));
display: block;
padding: lh(.5) lh();
text-align: center;
&:hover {
background-color: darken($mit-red, 10%);
border-color: darken($mit-red, 20%);
}
}
}
p {
width: flex-grid(4, 8);
line-height: lh();
float: left;
@media screen and (max-width: 780px) {
float: none;
width: 100%;
}
}
}
}
}
}
sass/index/_index.scss 0 → 100644
section.index-content {
@extend .wrapper;
@extend .clearfix;
section {
@extend .clearfix;
float: left;
@media screen and (max-width: 780px) {
float: none;
width: auto;
margin-right: 0;
}
h1 {
font-size: 800 24px "Open Sans";
margin-bottom: lh();
}
p {
line-height: lh();
margin-bottom: lh();
}
ul {
margin: 0;
}
&.about {
@include box-sizing(border-box);
border-right: 1px solid #e5e5e5;
margin-right: flex-gutter();
padding-right: flex-gutter() / 2;
width: flex-grid(8);
@media screen and (max-width: 780px) {
width: 100%;
border-right: 0;
margin-right: 0;
padding-right: 0;
}
section {
@extend .clearfix;
margin-bottom: lh();
p {
width: flex-grid(4, 8);
float: left;
@media screen and (max-width: 780px) {
float: none;
width: auto;
}
&:nth-child(odd) {
margin-right: flex-gutter(8);
@media screen and (max-width: 780px) {
margin-right: 0;
}
}
}
&.intro {
section {
margin-bottom: 0;
&.intro-text {
margin-right: flex-gutter(8);
width: flex-grid(4, 8);
@media screen and (max-width: 780px) {
margin-right: 0;
width: auto;
}
p {
margin-right: 0;
width: auto;
float: none;
}
}
&.intro-video {
width: flex-grid(4, 8);
@media screen and (max-width: 780px) {
width: auto;
}
a {
display: block;
width: 100%;
img {
width: 100%;
}
span {
display: none;
}
}
}
}
}
&.features {
border-top: 1px solid #E5E5E5;
padding-top: lh();
margin-bottom: 0;
h2 {
text-transform: uppercase;
letter-spacing: 1px;
color: #888;
margin-bottom: lh();
font-weight: normal;
font-size: 14px;
span {
text-transform: none;
}
}
p {
width: auto;
clear: both;
strong {
font-family: "Open sans";
font-weight: 800;
}
a {
color: $mit-red;
text-decoration: none;
@include transition();
&:hover, &:focus {
color: darken($mit-red, 15%);
}
}
}
ul {
margin-bottom: 0;
li {
line-height: lh();
width: flex-grid(4, 8);
float: left;
margin-bottom: lh(.5);
@media screen and (max-width: 780px) {
width: auto;
float: none;
}
&:nth-child(odd) {
margin-right: flex-gutter(8);
@media screen and (max-width: 780px) {
margin-right: 0;
}
}
}
}
}
}
}
&.course, &.staff {
width: flex-grid(4);
@media screen and (max-width: 780px) {
width: auto;
}
h1 {
color: #888;
font: normal $body-font-size $body-font-family;
font-size: 14px;
letter-spacing: 1px;
margin-bottom: lh();
text-transform: uppercase;
}
h2 {
font: 800 24px $header-font-family;
}
h3 {
font: 400 18px $header-font-family;
}
a {
@extend .button;
span.arrow {
color: rgba(#fff, .6);
font-style: normal;
@include inline-block();
padding-left: 10px;
}
}
ul {
list-style: none;
li {
img {
float: left;
margin-right: lh(.5);
}
}
}
}
&.course {
h2 {
padding-top: lh(5);
background: url('/static/images/marketing/circuits-bg.jpg') 0 0 no-repeat;
@include background-size(contain);
@media screen and (max-width: 998px) and (min-width: 781px){
background: url('/static/images/marketing/circuits-medium-bg.jpg') 0 0 no-repeat;
}
@media screen and (max-width: 780px) {
padding-top: lh(5);
background: url('/static/images/marketing/circuits-bg.jpg') 0 0 no-repeat;
}
@media screen and (min-width: 500px) and (max-width: 781px) {
padding-top: lh(8);
}
}
}
// index
//---------------------------------------- //
&.about-course {
@include box-sizing(border-box);
border-right: 1px solid #e5e5e5;
margin-right: flex-gutter();
padding-right: flex-gutter() / 2;
width: flex-grid(8);
@media screen and (max-width: 780px) {
width: auto;
border-right: 0;
margin-right: 0;
padding-right: 0;
}
section {
width: flex-grid(4, 8);
@media screen and (max-width: 780px) {
width: auto;
}
&.about-info {
margin-right: flex-gutter(8);
@media screen and (max-width: 780px) {
margin-right: 0;
}
}
&.requirements {
clear: both;
width: 100%;
border-top: 1px solid #E5E5E5;
padding-top: lh();
margin-bottom: 0;
p {
float: left;
width: flex-grid(4, 8);
margin-right: flex-gutter(8);
@media screen and (max-width: 780px) {
margin-right: 0;
float: none;
width: auto;
}
&:nth-child(odd) {
margin-right: 0;
}
}
}
&.cta {
width: 100%;
text-align: center;
a.enroll {
@extend .button;
padding: lh(.5) lh(2);
@include inline-block();
text-align: center;
font: 800 18px $header-font-family;
}
}
}
}
&.staff {
h1 {
margin-top: lh(1);
}
}
}
}
section.copyright, section.tos, section.privacy-policy, section.honor-code {
@extend .subpage;
}
sass/_index-variables.scss → sass/index/_variables.scss
......@@ -5,7 +5,7 @@ $fg-column: 60px;
$fg-gutter: 25px;
$fg-max-columns: 12;
$fg-max-width: 1400px;
$fg-min-width: 810px;
$fg-min-width: 781px;
$gw-column: 60px;
$gw-gutter: 25px;
......@@ -13,16 +13,8 @@ $gw-gutter: 25px;
$body-font-family: Georgia, serif;
$header-font-family: "Open Sans", Helvetica, Arial, sans-serif;
// @media screen and (min-width: 940px) {
$body-font-size: 16px;
// }
// @media screen and (max-width: 939px) {
// $body-font-size: 14px;
// }
$lh: golden-ratio($body-font-size, 1);
$body-font-size: 16px;
$body-line-height: golden-ratio($body-font-size, 1);
// Colors
$mit-red: #933;
......
sass/layout/_footer.scss 0 → 100644
footer {
@extend .clearfix;
@extend .wrapper;
@include box-sizing(border-box);
color: #777;
margin-top: $body-line-height;
padding: 0 $body-line-height;
p {
float: left;
a {
color: #444;
&:link, &:visited {
color: #444;
}
&:hover, &:focus {
color: #000;
}
}
}
ul {
float: right;
li {
display: inline-block;
margin-right: 20px;
a {
color: #444;
&:link, &:visited {
color: #444;
}
&:hover, &:focus {
color: #000;
}
}
}
}
}
sass/_layout.scss → sass/layout/_header.scss
html {
margin-top: 0;
body {
color: $dark-gray;
font: $body-font-size $body-font-family;
text-align: center;
margin: 0;
background: #f4f4f4; //#f3f1e5
div.header-wrapper {
// @include linear-gradient(lighten($mit-red, 5%), darken($mit-red, 5%));
@include box-shadow(inset 0 -1px 2px darken($mit-red, 10%));
background: $mit-red;
border-bottom: 1px solid #fff;
header {
@extend .clearfix;
@extend .wrapper;
@include box-sizing(border-box);
padding: 0 $body-line-height;
div.header-wrapper {
background: $mit-red;
border-bottom: 1px solid #fff;
@include box-shadow(inset 0 -4px 6px darken($mit-red, 5%));
hgroup {
@extend .clearfix;
float: left;
header {
@extend .clearfix;
@extend .wrapper;
@include box-sizing(border-box);
padding: 0 $body-line-height;
h1 {
border-right: 1px solid darken($mit-red, 5%);
color: darken($mit-red, 25%);
font-size: 20px;
font-weight: 800;
margin: 0 lh() 0 0;
padding: 17px lh() 14px 0;
text-shadow: 0 1px 0 lighten($mit-red, 10%);
line-height: lh();
@include inline-block();
}
hgroup {
@extend .clearfix;
float: left;
min-width: flex-grid(3);
padding-top: 13px;
h1 {
color: darken($mit-red, 25%);
font-size: 18px;
font-weight: 800;
@include inline-block();
line-height: lh();
margin: 0;
padding: 0 lh(.5) 0 0;
text-shadow: 0 1px 0 lighten($mit-red, 10%);
&:after {
color: darken($mit-red, 10%);
content: "•";
display: inline-block;
font-size: 10px;
letter-spacing: -2px;
padding-left: lh(.5);
text-shadow: 0;
}
}
h2 {
@include inline-block();
margin: 0 lh() 0 0;
padding: 19px lh() 9px 0;
line-height: lh();
border-right: 1px solid darken($mit-red, 5%);
-webkit-font-smoothing: antialiased;
a {
color: #fff;
text-decoration: none;
&:hover {
color: rgba(#fff, .7);
}
}
h2 {
font-size: 16px;
@include inline-block();
letter-spacing: 0;
margin: 0;
padding: 0 lh() 0px 0;
text-shadow: 0 -1px 0 darken($mit-red, 10%);
text-transform: none;
-webkit-font-smoothing: antialiased;
a {
color: #fff;
text-decoration: none;
&:hover {
color: rgba(#fff, .7);
}
}
}
@media screen and (max-width: 920px) {
border-bottom: 1px solid darken($mit-red, 5%);
display: block;
float: none;
h1 {
float: right;
border: 0;
margin-right: 0;
padding-right: 0;
}
@media screen and (max-width: 900px) {
display: block;
float: none;
h2 {
float: left;
border: 0;
margin-right: 0;
padding-right: 0;
}
}
h1 {
border: 0;
float: left;
}
nav {
h2 {
border: 0;
float: left;
display: block;
margin: 0;
padding: 0;
text-shadow: 0 -1px 0 darken($mit-red, 10%);
-webkit-font-smoothing: antialiased;
ul {
@extend .clearfix;
display: inline-block;
padding: 19px 0 9px;
margin: 0;
li {
margin-right: lh();
display: inline-block;
margin-bottom: 0;
line-height: lh();
a {
color: #fff;
text-decoration: none;
&:hover {
color: rgba(#fff, .7);
background-color: none;
text-decoration: none;
}
}
}
}
margin-right: 0;
}
}
}
section.main-content {
@extend .clearfix;
@extend .wrapper;
@include box-sizing(border-box);
@include border-radius(4px);
overflow: hidden;
background: #fff;
border-bottom: 1px solid #bbb;
@media screen and (min-width: 1400px) {
// @include border-radius(3px);
@include box-shadow(0 0 4px #dfdfdf);
border: 1px solid #bbb;
margin-top: lh(.5);
}
}
nav {
background: #501016;
border-bottom: 1px solid darken(#501016, 10%);
@include border-radius(3px 3px 0 0);
@include box-shadow(inset 0 0 0 1px darken(#501016, 5%), inset 0 2px 0 lighten(#501016, 5%));
display: block;
float: left;
margin: 5px 0 0;
padding: 0;
text-shadow: 0 -1px 0 darken($mit-red, 10%);
-webkit-font-smoothing: antialiased;
img {
max-width: 100%;
height: auto;
}
}
ul {
@extend .clearfix;
margin: 0;
footer {
@extend .clearfix;
@extend .wrapper;
@include box-sizing(border-box);
color: #777;
margin-top: $body-line-height;
padding: 0 $body-line-height;
li {
line-height: lh();
margin-bottom: 0;
float: left;
p {
float: left;
a {
color: #fff;
display: block;
font-weight: bold;
padding: 10px lh() 8px;
text-decoration: none;
a {
color: #444;
@media screen and (max-width: 1020px) {
padding: 10px lh(.7) 8px;
}
&:link, &:visited {
color: #444;
&:hover {
color: rgba(#fff, .7);
background-color: none;
}
}
}
}
@media screen and (max-width: 900px) {
width: 100%;
float: none;
&:hover, &:focus {
color: #000;
ul {
li {
padding: auto;
display: table-cell;
width: 16.6666666667%;
text-align: center;
}
}
}
}
ul {
float: right;
.active {
background: #F4F4F4;
border: 1px solid darken(#501016, 10%);
border-bottom: 0;
@include border-radius(3px 3px 0 0);
@include box-shadow(0 2px 0 #f4f4f4, inset 0 1px 0 #fff);
color: #333;
text-shadow: 0 1px 0 #fff;
}
li {
display: inline-block;
margin-right: 20px;
&.courseware {
li.courseware a {
@extend .active;
}
}
a {
color: #444;
&.book {
li.book a {
@extend .active;
}
}
&:link, &:visited {
color: #444;
&.info {
li.info a {
@extend .active;
}
}
&:hover, &:focus {
color: #000;
&.discussion {
li.discussion a {
@extend .active;
}
}
&.wiki {
li.wiki a {
@extend .active;
}
}
&.profile {
li.profile a {
@extend .active;
}
}
}
......
sass/layout/_layout.scss 0 → 100644
html {
margin-top: 0;
body {
color: $dark-gray;
font: $body-font-size $body-font-family;
text-align: center;
margin: 0;
background: #f4f4f4; //#f3f1e5
section.main-content {
@extend .clearfix;
@extend .wrapper;
@include box-sizing(border-box);
overflow: hidden;
background: #fff;
border-bottom: 1px solid #bbb;
margin-top: 3px;
@include box-shadow(0 0 4px #dfdfdf);
border: 1px solid #bbb;
@media screen and (min-width: 1400px) {
@include border-radius(4px);
margin-top: lh(.5);
}
}
}
}
sass/_leanmodal.scss → sass/layout/_leanmodal.scss
......@@ -10,24 +10,24 @@
}
div.leanModal_box {
background: #fff;
border: none;
@include border-radius(3px);
@include box-shadow(0 0 6px #000);
@include box-sizing(border-box);
display: none;
border: none;
background: #fff;
padding: lh(2);
a.modal_close {
color: #aaa;
display: block;
font-style: normal;
height: 14px;
position: absolute;
top: 12px;
right: 12px;
display: block;
top: 12px;
width: 14px;
height: 14px;
z-index: 2;
color: #aaa;
font-style: normal;
&:hover{
text-decoration: none;
......@@ -36,17 +36,21 @@ div.leanModal_box {
}
h1 {
border-bottom: 1px solid #eee;
font-size: 24px;
margin-bottom: lh();
margin-top: 0;
padding-bottom: lh();
border-bottom: 1px solid #eee;
margin-bottom: lh();
text-align: left;
}
&#enroll {
max-width: 600px;
p.ie-warning {
display: none;
}
ol {
@extend .clearfix;
......@@ -63,16 +67,16 @@ div.leanModal_box {
&:hover {
div.tip {
display: block;
line-height: lh();
position: absolute;
background: #333;
color: #fff;
width: 500px;
display: block;
font-size: 16px;
line-height: lh();
margin: 0 0 0 -10px;
padding: 10px;
position: absolute;
-webkit-font-smoothing: antialiased;
font-size: 16px;
width: 500px;
}
}
}
......@@ -84,16 +88,16 @@ div.leanModal_box {
div#enroll_error, div#login_error, div#pwd_error {
$error-color: #333;
-webkit-font-smoothing: antialiased;
background-color: $error-color;
border: darken($error-color, 20%);
color: #fff;
text-shadow: 0 1px 0 darken($error-color, 10%);
font-family: "Open sans";
font-weight: bold;
letter-spacing: 1px;
margin: (-(lh())) (-(lh())) lh();
padding: lh(.5);
text-shadow: 0 1px 0 darken($error-color, 10%);
-webkit-font-smoothing: antialiased;
&:empty {
padding: 0;
......@@ -108,11 +112,11 @@ div.leanModal_box {
margin-bottom: lh(.5);
&.terms, &.remember {
float: none;
width: auto;
border-top: 1px solid #eee;
clear: both;
float: none;
padding-top: lh();
border-top: 1px solid #eee;
width: auto;
}
&.honor-code {
......@@ -139,11 +143,11 @@ div.leanModal_box {
margin: lh(.5) 0 lh() lh();
li {
list-style: disc outside none;
margin-bottom: lh(.5);
color: #666;
font-size: 14px;
float: none;
font-size: 14px;
list-style: disc outside none;
margin-bottom: lh(.5);
}
}
}
......@@ -221,7 +225,6 @@ div#feedback_div{
div#calculator_div {
max-width: 500px;
form {
padding-bottom: lh();
margin-bottom: lh();
......@@ -246,11 +249,12 @@ div#calculator_div {
input#calculator_output {
border: 0;
background: 0;
background: none;
padding: lh(.35);
width: 60px;
font-size: 24px;
width: 378px;
font-weight: bold;
margin-top: 4px;
}
}
......
sass/marketing-ie.scss
......@@ -7,3 +7,14 @@ body {
margin: 0;
overflow: hidden;
}
div#enroll {
p.ie-warning {
display: block !important;
line-height: 1.3em;
}
form {
display: none;
}
}
sass/marketing.scss
@import "bourbon/bourbon";
@import "reset";
@import "font-face";
@import "base/reset", "base/font-face", "base/functions";
// pages
@import "index-functions", "index-variables", "index-extends", "index";
@import "leanmodal";
@import "index/variables", "index/extends", "index/base", "index/header", "index/footer", "index/index";
@import "layout/leanmodal";
sass/print.scss 0 → 100644
.header-wrapper {display:none;}
#accordion {display:none;}
.ui-accordion {display:none;
visibility:hidden;
width:0%;
}
sass/wiki/_sidebar.scss 0 → 100644
div#wiki_panel {
@extend .sidebar;
overflow: auto;
input[type="button"] {
@extend h3;
@include transition();
color: lighten($text-color, 10%);
font-size: $body-font-size;
margin: 0 !important;
padding: 7px lh();
text-align: left;
width: 100%;
&:hover {
@include box-shadow(0 1px 0 #fff);
background: #efefef;
}
}
ul {
li {
&.search {
@include box-shadow(0 1px 0 #eee);
border-bottom: 1px solid #d3d3d3;
padding: 7px lh();
label {
display: none;
}
}
&.create-article {
h3 {
a {
padding: 7px lh();
}
}
}
}
}
div#wiki_create_form {
@extend .clearfix;
padding: 15px;
background: #d6d6d6;
border-bottom: 1px solid #bbb;
input[type="text"] {
margin-bottom: 6px;
display: block;
width: 100%;
@include box-sizing(border-box);
}
ul {
list-style: none;
li {
float: left;
&#cancel {
float: right;
margin-top: 10px;
}
}
}
}
}
sass/_wiki.scss → sass/wiki/_wiki.scss
......@@ -2,76 +2,6 @@ div.wiki-wrapper {
display: table;
width: 100%;
div#wiki_panel {
@extend .sidebar;
overflow: auto;
input[type="button"] {
@extend h3;
@include transition();
color: lighten($text-color, 10%);
font-size: $body-font-size;
margin: 0 !important;
padding: 7px lh();
text-align: left;
width: 100%;
&:hover {
@include box-shadow(0 1px 0 #fff);
background: #efefef;
}
}
ul {
li {
&.search {
@include box-shadow(0 1px 0 #eee);
border-bottom: 1px solid #d3d3d3;
padding: 7px lh();
label {
display: none;
}
}
&.create-article {
h3 {
a {
padding: 7px lh();
}
}
}
}
}
div#wiki_create_form {
@extend .clearfix;
padding: 15px;
background: #d6d6d6;
border-bottom: 1px solid #bbb;
input[type="text"] {
margin-bottom: 6px;
display: block;
width: 100%;
@include box-sizing(border-box);
}
ul {
list-style: none;
li {
float: left;
&#cancel {
float: right;
margin-top: 10px;
}
}
}
}
}
section.wiki-body {
@extend .content;
......
schematic_tutorial.html deleted 120000 → 0
../data/problems/schematic_tutorial.html
\ No newline at end of file
staff_problem_info.html 0 → 100644
<div class="staff_info">
${xml | h}
</div>
staticbook.html
......@@ -16,19 +16,19 @@ function goto_page(n) {
if(n<10) {
prefix="00";
}
$("#bookpage").attr("src","${ settings.BOOK_URL }p"+prefix+n+".jpg");
$("#bookpage").attr("src","${ settings.BOOK_URL }p"+prefix+n+".png");
};
function prev_page() {
var newpage=page-1;
if(newpage<1) newpage=1;
if(newpage<0) newpage=0;
goto_page(newpage);
log_event("book", {"type":"prevpage","new":page});
}
function next_page() {
var newpage=page+1;
if(newpage>1764) newpage=1764;
if(newpage>1008) newpage=1008;
goto_page(newpage);
log_event("book", {"type":"nextpage","new":page});
}
......@@ -56,7 +56,18 @@ function next_page() {
</ul>
</nav>
<img id="bookpage" src="${ settings.BOOK_URL }p${ "%03i"%(page) }.jpg">
<img id="bookpage" src="${ settings.BOOK_URL }p${ "%03i"%(page) }.png">
<nav class="bottom-nav">
<ul>
<li class="last">
<a href="javascript:prev_page()">Previous page</a>
</li>
<li class="next">
<a href="javascript:next_page()">Next page</a>
</li>
</ul>
</nav>
</section>
</section>
</div>
......
tos.html
......@@ -78,9 +78,7 @@ intent of misleading others.
<li>You, furthermore, agree not to scrape, or otherwise download in
bulk, user-contributed content, a list or directory of users on the
system, or other material including but not limited to on-line
textbooks, User Postings, or user information. You agree not to store
more than 5 pages of the electronic textbook or 5 forum posts in any
permanent medium (hard drive, optical disk, etc., flash drive, etc.).
textbooks, User Postings, or user information.
<lu>You agree to not misrepresent or attempt to misrepresent your
identity while using the Sites (although you are welcome and
encouraged to use an anonymous username in the forums).
......@@ -215,7 +213,8 @@ risk. Your access to or download of information, materials, or data
through the Site or any reference sites is at your own discretion and
risk and that you will be solely responsible for any damage to your
property (including your computer system) or loss of data that results
from the download or use of such material or data.</p>
from the download or use of such material or data. We may close or
limit enrollment for pedagogical or technological reasons.</p>
<p><strong>User Postings Disclaimer.</strong> You understand that when
using the Site you will be exposed to User Postings from a variety of
......@@ -301,6 +300,6 @@ consent to the personal jurisdiction of and exclusive venue in the
federal and state courts located in and serving Boston, Massachusetts
as the legal forum for any such dispute.</p>
<p><strong>Effective Date:</strong> February 6, 2012</p><div>
<p><strong>Effective Date:</strong> February 20, 2012</p><div>
</div>
</section>
video_init.js
......@@ -58,15 +58,23 @@ for(var i=0; i<l.length; i++) {
add_speed(l[i], streams[l[i]])
}
//toggle video play/pause. the HTML assumes video is always autoplayed
//initially since it starts with class "pause". may want to set that in
//javascript
$("#video_control").click(function(){
if ($(this).hasClass("play")){
function toggleVideo(){
if ($("#video_control").hasClass("play")){
play();
$(this).removeClass().addClass("pause");
$("#video_control").removeClass().addClass("pause");
} else {
pause();
$(this).removeClass().addClass("play");
$("#video_control").removeClass().addClass("play");
}
}
$("#video_control").click(toggleVideo);
// space bar to pause video
$(".video-wrapper").keyup(function(e){
active = document.activeElement;
if (e.which == 32) {
e.preventDefault();
$("#video_control").click();
}
});
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