merged kf-refactor into default
This commit is contained in:
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
.sass-cache/47c2162753299d6160744ee2ad10f568b60c57a1/_base.scssc
Normal file
BIN
.sass-cache/47c2162753299d6160744ee2ad10f568b60c57a1/_base.scssc
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
.sass-cache/d71392d31c3b10df78042d13a0384e71b83fa11e/_base.scssc
Normal file
BIN
.sass-cache/d71392d31c3b10df78042d13a0384e71b83fa11e/_base.scssc
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -1,27 +1,32 @@
|
||||
<%def name="make_chapter(chapter)">
|
||||
<h3><a href="#">${chapter['name']}</a></h3>
|
||||
<div>
|
||||
<ul style="margin-left:-2em;">
|
||||
% for section in chapter['sections']:
|
||||
<li> <div
|
||||
% if 'active' in section and section['active']:
|
||||
style="background-color:#aed0ea;"
|
||||
% endif
|
||||
>
|
||||
<a href='/courseware/${format_string(course_name)}/${format_string(chapter['name'])}/${format_string(section['name'])}'>${section['name']}</a> <br>
|
||||
<small><b>${section['format']}</b>
|
||||
% if 'time' in section and section['time']!="":
|
||||
(${int(section['time'])/60} min)
|
||||
% endif
|
||||
% if 'due' in section and section['due']!="":
|
||||
due ${section['due']}
|
||||
% endif
|
||||
</small>
|
||||
</div>
|
||||
% endfor
|
||||
</ul>
|
||||
</div>
|
||||
</%def>
|
||||
<h3><a href="#">${chapter['name']}</a></h3>
|
||||
|
||||
<ul>
|
||||
% for section in chapter['sections']:
|
||||
<li
|
||||
% if 'active' in section and section['active']:
|
||||
class="active"
|
||||
% endif
|
||||
>
|
||||
|
||||
<a href='/courseware/${format_string(course_name)}/${format_string(chapter['name'])}/${format_string(section['name'])}'>
|
||||
${section['name']}
|
||||
|
||||
<p>
|
||||
${section['format']}
|
||||
|
||||
% if 'time' in section and section['time']!="":
|
||||
(${int(section['time'])/60} min)
|
||||
% endif
|
||||
|
||||
% if 'due' in section and section['due']!="":
|
||||
due ${section['due']}
|
||||
% endif
|
||||
</p>
|
||||
</a>
|
||||
% endfor
|
||||
</ul>
|
||||
</%def>
|
||||
|
||||
% for chapter in toc:
|
||||
${make_chapter(chapter)}
|
||||
|
||||
@@ -1,3 +1,3 @@
|
||||
<h1> Activation Complete </h1>
|
||||
<h1>Activation Complete</h1>
|
||||
|
||||
<p> Now go <a href="/">log in</a> and try the course!
|
||||
<p>Now go <a href="/">log in</a> and try the course!</a></p>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<h1> Activation Invalid </h1>
|
||||
<h1>Activation Invalid </h1>
|
||||
|
||||
<p> Something went wrong. Did you already activate the account? If so,
|
||||
<p>Something went wrong. Did you already activate the account? If so,
|
||||
go <a href="/">log in</a> and try the course. Otherwise, e-mail us to
|
||||
let us know what happened.
|
||||
let us know what happened.</p>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
<%inherit file="main.html" />
|
||||
|
||||
<!-- TODO: http://docs.jquery.com/Plugins/Validation -->
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
@@ -21,35 +22,16 @@ $('#hide_acc').click(function() {
|
||||
});
|
||||
</script>
|
||||
|
||||
<div id="coursenav" align=right width=100%>
|
||||
<a href="/book">Textbook</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/courseware"><b>Courseware</b></a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/discussion">Discussion</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/wiki">Wiki</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/profile">Profile</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/s/help.html">Help</a> <span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/logout">Log out</a>
|
||||
<%include file="navigation.html" />
|
||||
|
||||
<section class="main-content">
|
||||
<div class="course-wrapper">
|
||||
<div id="accordion">
|
||||
${accordion}
|
||||
</div>
|
||||
|
||||
|
||||
<div id="bodyContent">
|
||||
<table width=100% cellpadding=0><tr>
|
||||
<td width=276 valign=top>
|
||||
<div id="accordion" style="position:relative; top:-6px; ">
|
||||
${accordion}
|
||||
</div>
|
||||
</td>
|
||||
<td valign=top>
|
||||
<div>
|
||||
${content}
|
||||
</div>
|
||||
</td>
|
||||
</tr></table>
|
||||
|
||||
|
||||
</div>
|
||||
<section class="course-content">
|
||||
${content}
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
102
credits.html
102
credits.html
@@ -1,55 +1,57 @@
|
||||
<%inherit file="main.html" />
|
||||
<div id="topWrapper">
|
||||
<div id="topBanner"></div>
|
||||
</div>
|
||||
<div id="topnav">
|
||||
<ul>
|
||||
<li id="current" style="border:none">
|
||||
<a href="#" shape="rect">Home</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/info.html" shape="rect">Course Info</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/staff.html" shape="rect">Instructors</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="credits.html" shape="rect">Credits</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- end top wrapper -->
|
||||
<div id="wrapper">
|
||||
<div id="bg">
|
||||
<div id="header"></div>
|
||||
<div id="page">
|
||||
<!-- begin container -->
|
||||
<div id="container">
|
||||
<!-- content -->
|
||||
<div id="content">
|
||||
|
||||
|
||||
<h1> Credits </h1>
|
||||
|
||||
<p> The team of instructors is Anant Agarwal, Piotr Mitros, Chris
|
||||
Terman, and Gerald Sussman. Our intrepid team of TAs is
|
||||
|
||||
<p> The main codebase was crammed out in two months by Piotr
|
||||
Mitros. Evgeny Fadeev helped integrate Askbot into the
|
||||
system. Schematic entry and circuit simulation are by Chris
|
||||
Terman. Jean-Michel Claus designed the applets. IT and infrastructure
|
||||
are managed by Scott Bloomquist of TechSquare, Inc.
|
||||
|
||||
<p> The codebase was made possible by Django, JQuery, JQueryUI,
|
||||
MathJAX, swfobject, askbot, django-simplewiki, pyparsing, and the
|
||||
original FancyBox. Graphic design and css started from a free template
|
||||
from <a href="http://www.dotemplate.com/">dotemplate.com</a>, one of
|
||||
the few, genuinely free template web sites (although you have to
|
||||
e-mail the owner to find that out), and was heavily modified by Piotr
|
||||
Mitros, and later, thoughtbot.
|
||||
|
||||
<p> The system is running in the Amazon cloud.
|
||||
|
||||
<div id="topWrapper">
|
||||
<div id="topBanner"></div>
|
||||
</div>
|
||||
|
||||
<div id="topnav">
|
||||
<ul>
|
||||
<li id="current" style="border:none">
|
||||
<a href="#" shape="rect">Home</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/info.html" shape="rect">Course Info</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/staff.html" shape="rect">Instructors</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="credits.html" shape="rect">Credits</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- end top wrapper -->
|
||||
<div id="wrapper">
|
||||
<div id="bg">
|
||||
|
||||
<div id="page">
|
||||
<!-- begin container -->
|
||||
|
||||
<div id="container">
|
||||
<!-- content -->
|
||||
<div id="content">
|
||||
|
||||
<h1> Credits </h1>
|
||||
|
||||
<p> The team of instructors is Anant Agarwal, Piotr Mitros, Chris
|
||||
Terman, and Gerald Sussman. Our intrepid team of TAs is
|
||||
|
||||
<p> The main codebase was crammed out in two months by Piotr
|
||||
Mitros. Evgeny Fadeev helped integrate Askbot into the
|
||||
system. Schematic entry and circuit simulation are by Chris
|
||||
Terman. Jean-Michel Claus designed the applets. IT and infrastructure
|
||||
are managed by Scott Bloomquist of TechSquare, Inc.</p>
|
||||
|
||||
<p> The codebase was made possible by Django, JQuery, JQueryUI,
|
||||
MathJAX, swfobject, askbot, django-simplewiki, pyparsing, and the
|
||||
original FancyBox. Graphic design and css started from a free template
|
||||
from <a href="http://www.dotemplate.com/">dotemplate.com</a>, one of
|
||||
the few, genuinely free template web sites (although you have to
|
||||
e-mail the owner to find that out), and was heavily modified by Piotr
|
||||
Mitros, and later, thoughtbot.</p>
|
||||
|
||||
<p> The system is running in the Amazon cloud, which allows us to hold up to anticipated loads. </p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
53
credits.html.orig
Normal file
53
credits.html.orig
Normal file
@@ -0,0 +1,53 @@
|
||||
<%inherit file="main.html" />
|
||||
|
||||
<div id="topnav">
|
||||
<ul>
|
||||
<li id="current" style="border:none">
|
||||
<a href="#" shape="rect">Home</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/info.html" shape="rect">Course Info</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/staff.html" shape="rect">Instructors</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="credits.html" shape="rect">Credits</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- end top wrapper -->
|
||||
<div id="wrapper">
|
||||
<div id="bg">
|
||||
|
||||
<div id="page">
|
||||
<!-- begin container -->
|
||||
|
||||
<div id="container">
|
||||
<!-- content -->
|
||||
<div id="content">
|
||||
|
||||
<h1> Credits </h1>
|
||||
|
||||
<p> The team of instructors is Anant Agarwal, Piotr Mitros, Chris
|
||||
Terman, and Gerald Sussman. Our intrepid team of TAs is
|
||||
|
||||
<p> The main codebase was crammed out in two months by Piotr
|
||||
Mitros. Evgeny Fadeev helped integrate Askbot into the
|
||||
system. Schematic entry and circuit simulation are by Chris
|
||||
Terman. Jean-Michel Claus designed the applets. IT and infrastructure
|
||||
are managed by Scott Bloomquist of TechSquare, Inc.</p>
|
||||
|
||||
<p> The codebase was made possible by Django, JQuery, JQueryUI,
|
||||
MathJAX, swfobject, askbot, django-simplewiki, pyparsing, and the
|
||||
original FancyBox. Graphic design and css started from a free template
|
||||
from <a href="http://www.dotemplate.com/">dotemplate.com</a>, one of
|
||||
the few, genuinely free template web sites (although you have to
|
||||
e-mail the owner to find that out), and was heavily modified by Piotr
|
||||
Mitros, and later, thoughtbot.</p>
|
||||
|
||||
<p> The system is running in the Amazon cloud, which allows us to hold up to anticipated loads. </p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
57
help.html
57
help.html
@@ -1,41 +1,24 @@
|
||||
<%inherit file="main.html" />
|
||||
<div id="coursenav" align=right width=100%>
|
||||
<a href="/book">Textbook</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/courseware">Courseware</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/discussion">Discussion</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/wiki">Wiki</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/profile">Profile</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/s/help.html"><b>Help</b></a> <span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/logout">Log out</a>
|
||||
</div>
|
||||
|
||||
<div align=center width=100%>
|
||||
<div align=left width=100 style="width:400px; ">
|
||||
<h1> Help </h1>
|
||||
<%include file="navigation.html" />
|
||||
|
||||
<p> If you need help, first try <a href="discussion/questions/">asking
|
||||
a question in the forums</a> and in the IRC channel (irc.mitx.org,
|
||||
channel #6002). As the semester starts, we will add a Frequently Asked
|
||||
Questions section.
|
||||
<section class="main-content">
|
||||
<h1>Help</h1>
|
||||
|
||||
<p> If you can't solve your problems with self-help, we have several
|
||||
e-mail addresses set up:
|
||||
<dl>
|
||||
<dt> technical@mitx.mit.edu
|
||||
<dd> System-related questions
|
||||
<dt> content@mitx.mit.edu
|
||||
<dd> Content-related questions
|
||||
<dt> bugs@mitx.mit.edu
|
||||
<dd> Bug reports
|
||||
<dt> suggestions@mitx.mit.edu
|
||||
<dd> Suggestions
|
||||
</dl>
|
||||
<p> Please bear in mind that while we read them, we do not expect to
|
||||
have time to respond to all e-mails.
|
||||
</div>
|
||||
</div>
|
||||
<p> If you need help, first try <a href="discussion/questions/">asking a question in the forums</a> and in the IRC channel (irc.mitx.org, channel #6002). As the semester starts, we will add a Frequently Asked Questions section.</p>
|
||||
|
||||
<p> If you can't solve your problems with self-help, we have several e-mail addresses set up:</p>
|
||||
|
||||
<dl>
|
||||
<dt> technical@mitx.mit.edu</dt>
|
||||
<dd> System-related questions</dd>
|
||||
<dt> content@mitx.mit.edu</dt>
|
||||
<dd> Content-related questions</dd>
|
||||
<dt> bugs@mitx.mit.edu</dt>
|
||||
<dd> Bug reports</dd>
|
||||
<dt> suggestions@mitx.mit.edu</dt>
|
||||
<dd> Suggestions</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>
|
||||
|
||||
@@ -1,10 +1,14 @@
|
||||
<h1> ${ homework['name']} </h1>
|
||||
|
||||
<ol>
|
||||
% for problem in homework['problems']:
|
||||
<h2> ${ problem['name'] } </h2>
|
||||
${ problem['html'] }
|
||||
<br>
|
||||
<input type="hidden" name="problem_id" value="${ problem['name'] }">
|
||||
<input type="submit" value="Check">
|
||||
<li>
|
||||
<h2> ${ problem['name'] } </h2>
|
||||
${ problem['html'] }
|
||||
<br>
|
||||
<input type="hidden" name="problem_id" value="${ problem['name'] }">
|
||||
<input type="submit" value="Check">
|
||||
</li>
|
||||
% endfor
|
||||
</ol>
|
||||
|
||||
|
||||
132
index.html
132
index.html
@@ -74,76 +74,78 @@ $(function() {
|
||||
|
||||
</script>
|
||||
|
||||
<div id="topWrapper">
|
||||
<div id="topBanner"></div>
|
||||
</div>
|
||||
<div id="topnav">
|
||||
<ul>
|
||||
<li id="current" style="border:none">
|
||||
<a href="#" shape="rect">Home</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/info.html" shape="rect">Course Info</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/staff.html" shape="rect">Instructors</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/credits.html" shape="rect">Credits</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- end top wrapper -->
|
||||
<div id="wrapper">
|
||||
<div id="bg">
|
||||
<div id="header"></div>
|
||||
<div id="page">
|
||||
<!-- begin container -->
|
||||
<div id="container">
|
||||
<!-- content -->
|
||||
<div id="content">
|
||||
|
||||
<center>
|
||||
<table>
|
||||
<tr><td align=right><big><a id="inline" href="#enroll">Enroll >></a><br><br><br>
|
||||
<a id="inline" href="#login">Log In >></a></big></td><td><div style="width:50px; float:center;"></div></td><td>
|
||||
<div style="width:300px; float:center;">
|
||||
Taught by Anant Agarwal, with Gerald Sussman, Piotr Mitros, and Chris
|
||||
Terman, "6.002 Circuits and Electronics" is an an on-line adaption of
|
||||
MIT's first undergraduate analog design course. This course will run,
|
||||
free of charge, for students worldwide from February 1, 2012 through
|
||||
July 1, 2012.
|
||||
|
||||
<br><br>Students who successfully complete the course will receive an
|
||||
electronic certificate of accomplishment from MIT. Students will not
|
||||
receive course credit, but students successfully finishing the course
|
||||
will be well-placed to take an exam to pass out of 6.002 should they
|
||||
ever enroll at MIT, and potentially, similar courses at other schools.
|
||||
|
||||
<br><br> In order to succeed in this course, students must have some
|
||||
background in calculus and differential equations. Since more advanced
|
||||
mathematics will not show up until the second half of the course, the
|
||||
first half of the course will include an optional remedial
|
||||
differential equations component for students with weaker math
|
||||
backgrounds.
|
||||
|
||||
<div id="topWrapper">
|
||||
<div id="topBanner"></div>
|
||||
</div>
|
||||
|
||||
<div style="display:none"><div id="enroll" name="enroll"><%include file="create_account.html" /></div></div>
|
||||
<div style="display:none"><div id="login"><%include file="login.html" /></div></div>
|
||||
<div style="display:none"><div id="pwd_reset"><%include file="password_reset_form.html" /></div></div>
|
||||
<div style="display:none"><div id="reset_done"></div></div>
|
||||
<div id="topnav">
|
||||
<ul>
|
||||
<li id="current" style="border:none">
|
||||
<a href="#" shape="rect">Home</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/info.html" shape="rect">Course Info</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/staff.html" shape="rect">Instructors</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/credits.html" shape="rect">Credits</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- end top wrapper -->
|
||||
<div id="wrapper">
|
||||
<div id="bg">
|
||||
<div id="header"></div>
|
||||
<div id="page">
|
||||
<!-- begin container -->
|
||||
<div id="container">
|
||||
<!-- content -->
|
||||
<div id="content">
|
||||
|
||||
<center>
|
||||
<table>
|
||||
<tr><td align=right><big><a id="inline" href="#enroll">Enroll >></a><br><br><br>
|
||||
<a id="inline" href="#login">Log In >></a></big></td><td><div style="width:50px; float:center;"></div></td><td>
|
||||
<div style="width:300px; float:center;">
|
||||
Taught by Anant Agarwal, with Gerald Sussman, Piotr Mitros, and Chris
|
||||
Terman, "6.002 Circuits and Electronics" is an an on-line adaption of
|
||||
MIT's first undergraduate analog design course. This course will run,
|
||||
free of charge, for students worldwide from February 1, 2012 through
|
||||
July 1, 2012.
|
||||
|
||||
<br><br>Students who successfully complete the course will receive an
|
||||
electronic certificate of accomplishment from MIT. Students will not
|
||||
receive course credit, but students successfully finishing the course
|
||||
will be well-placed to take an exam to pass out of 6.002 should they
|
||||
ever enroll at MIT, and potentially, similar courses at other schools.
|
||||
|
||||
<br><br> In order to succeed in this course, students must have some
|
||||
background in calculus and differential equations. Since more advanced
|
||||
mathematics will not show up until the second half of the course, the
|
||||
first half of the course will include an optional remedial
|
||||
differential equations component for students with weaker math
|
||||
backgrounds.
|
||||
|
||||
</div>
|
||||
|
||||
<div style="display:none"><div id="enroll" name="enroll"><%include file="create_account.html" /></div></div>
|
||||
<div style="display:none"><div id="login"><%include file="login.html" /></div></div>
|
||||
<div style="display:none"><div id="pwd_reset"><%include file="password_reset_form.html" /></div></div>
|
||||
<div style="display:none"><div id="reset_done"></div></div>
|
||||
|
||||
|
||||
</td></tr></table>
|
||||
</td></tr></table>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<!-- end content -->
|
||||
</div>
|
||||
<!-- end container -->
|
||||
</div>
|
||||
<!-- end content -->
|
||||
</div>
|
||||
<div id="footerWrapper"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end container -->
|
||||
</div>
|
||||
<div id="footerWrapper"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
151
index.html.orig
Normal file
151
index.html.orig
Normal file
@@ -0,0 +1,151 @@
|
||||
<%inherit file="main.html" />
|
||||
<script>
|
||||
$(function() {
|
||||
/* Set up FancyBox pop-ups */
|
||||
$("a#inline").fancybox({
|
||||
'hideOnContentClick': false
|
||||
});
|
||||
|
||||
// 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.
|
||||
Either shows error, or shows success. */
|
||||
$('#create_account_button').click(function() {
|
||||
var submit_data={};
|
||||
$.each($("[id^=ca_]"), function(index,value){
|
||||
submit_data[value.name]=value.value;
|
||||
});
|
||||
$.each($("[id^=cb_]"), function(index,value){
|
||||
submit_data[value.name]=value.checked;
|
||||
});
|
||||
|
||||
postJSON('/create_account',
|
||||
submit_data,
|
||||
function(json) {
|
||||
if(json.success) {
|
||||
$('#enroll').html(json.value);
|
||||
} else {
|
||||
$('#enroll_error').html(json.value);
|
||||
}
|
||||
}
|
||||
);
|
||||
});
|
||||
|
||||
/* Handles when the user tries to log in. Grabs form data. Does AJAX.
|
||||
Either shows error, or redirects. */
|
||||
$('#login_button').click(function() {
|
||||
var submit_data={};
|
||||
$.each($("[id^=li_]"), function(index,value){
|
||||
submit_data[value.name]=value.value;
|
||||
});
|
||||
submit_data["remember"] = ($('#remember').attr("checked")? true : false);
|
||||
|
||||
postJSON('/login',
|
||||
submit_data,
|
||||
function(json) {
|
||||
if(json.success) {
|
||||
location.href="/courseware";
|
||||
} else {
|
||||
$('#login_error').html("Invalid Login");
|
||||
}
|
||||
}
|
||||
);
|
||||
});
|
||||
|
||||
$('#pwd_reset_button').click(function() {
|
||||
$.post('/password_reset/',{ "csrfmiddlewaretoken" : "${ csrf }",
|
||||
"email" : $('#id_email').val()}, function(data){
|
||||
$('#pwd_reset').html(data);
|
||||
});
|
||||
});
|
||||
|
||||
/* Activate stupid spinner drop-downs in enrollment form */
|
||||
var spinner_array=$("[id^=spinner_]");
|
||||
spinner_array.each(function(i) {
|
||||
var s=spinner_array[i];
|
||||
$("#"+s.id).click(function(){
|
||||
$("#sregion"+s.id.substring(7)).toggle();
|
||||
});
|
||||
})
|
||||
|
||||
|
||||
/*$("sregion"+$("[id^=spinner_]")[1].id.substring(7)) */
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<div id="topWrapper">
|
||||
<div id="topBanner"></div>
|
||||
</div>
|
||||
|
||||
<div id="topnav">
|
||||
<ul>
|
||||
<li id="current" style="border:none">
|
||||
<a href="#" shape="rect">Home</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/info.html" shape="rect">Course Info</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/staff.html" shape="rect">Instructors</a>
|
||||
</li>
|
||||
<li style="border:none">
|
||||
<a href="/t/credits.html" shape="rect">Credits</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- end top wrapper -->
|
||||
<div id="wrapper">
|
||||
<div id="bg">
|
||||
<div id="header"></div>
|
||||
<div id="page">
|
||||
<!-- begin container -->
|
||||
<div id="container">
|
||||
<!-- content -->
|
||||
<div id="content">
|
||||
|
||||
<center>
|
||||
<table>
|
||||
<tr><td align=right><big><a id="inline" href="#enroll">Enroll >></a><br><br><br>
|
||||
<a id="inline" href="#login">Log In >></a></big></td><td><div style="width:50px; float:center;"></div></td><td>
|
||||
<div style="width:300px; float:center;">
|
||||
Taught by Anant Agarwal, with Gerald Sussman, Piotr Mitros, and Chris
|
||||
Terman, "6.002 Circuits and Electronics" is an an on-line adaption of
|
||||
MIT's first undergraduate analog design course. This course will run,
|
||||
free of charge, for students worldwide from February 1, 2012 through
|
||||
July 1, 2012.
|
||||
|
||||
<br><br>Students who successfully complete the course will receive an
|
||||
electronic certificate of accomplishment from MIT. Students will not
|
||||
receive course credit, but students successfully finishing the course
|
||||
will be well-placed to take an exam to pass out of 6.002 should they
|
||||
ever enroll at MIT, and potentially, similar courses at other schools.
|
||||
|
||||
<br><br> In order to succeed in this course, students must have some
|
||||
background in calculus and differential equations. Since more advanced
|
||||
mathematics will not show up until the second half of the course, the
|
||||
first half of the course will include an optional remedial
|
||||
differential equations component for students with weaker math
|
||||
backgrounds.
|
||||
|
||||
</div>
|
||||
|
||||
<div style="display:none"><div id="enroll" name="enroll"><%include file="create_account.html" /></div></div>
|
||||
<div style="display:none"><div id="login"><%include file="login.html" /></div></div>
|
||||
<div style="display:none"><div id="pwd_reset"><%include file="password_reset_form.html" /></div></div>
|
||||
<div style="display:none"><div id="reset_done"></div></div>
|
||||
|
||||
|
||||
</td></tr></table>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<!-- end content -->
|
||||
</div>
|
||||
<!-- end container -->
|
||||
</div>
|
||||
<div id="footerWrapper"></div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,7 +1,9 @@
|
||||
<%inherit file="main.html" />
|
||||
|
||||
<div id="topWrapper">
|
||||
<div id="topBanner"></div>
|
||||
</div>
|
||||
|
||||
<div id="topnav">
|
||||
<ul>
|
||||
<li style="border:none">
|
||||
|
||||
72
main.html
72
main.html
@@ -1,29 +1,29 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title> MITX 6.002 </title>
|
||||
<link rel="stylesheet" href="/static/lib/jquery.treeview.css" type="text/css" media="all" />
|
||||
<link rel="stylesheet" href="/static/css/theme.css" type="text/css" media="all" />
|
||||
<link rel="stylesheet" href="/static/css/local.css" type="text/css" media="all" />
|
||||
<link href="/static/css/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css"/>
|
||||
<style type="text/css">#slider { margin: 10px; }</style>
|
||||
<script type="text/javascript" src="/static/lib/jquery-1.6.2.min.js"></script>
|
||||
<script type="text/javascript" src="/static/lib/jquery-ui-1.8.16.custom.min.js"></script>
|
||||
<script type="text/javascript" src="/static/lib//swfobject/swfobject.js"></script>
|
||||
<script type="text/javascript" src="/static/lib/jquery.treeview.js"></script>
|
||||
<script type="text/javascript" src="/static/js/video_player.js"></script>
|
||||
<script type="text/javascript" src="/static/js/schematic.js"></script>
|
||||
<style type="text/css">#slider { margin: 10px; }</style>
|
||||
<!-- Warning: Do not upgrade FancyBox. V2.0 is under a non-free CC license -->
|
||||
<script type="text/javascript" src="/static/lib/fancybox/jquery.fancybox-1.3.4.js"></script>
|
||||
<link rel="stylesheet" href="/static/lib/fancybox/jquery.fancybox-1.3.4.css">
|
||||
<script type="text/x-mathjax-config">
|
||||
MathJax.Hub.Config({
|
||||
tex2jax: {inlineMath: [["\\(","\\)"]],
|
||||
displayMath: [["\\[","\\]"]]}
|
||||
});
|
||||
</script>
|
||||
<script type="text/javascript" src="/static/lib/mathjax/MathJax.js?config=TeX-AMS_HTML-full"></script>
|
||||
<title>MITX 6.002</title>
|
||||
|
||||
<link rel="stylesheet" href="/static/lib/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"/>
|
||||
|
||||
<script type="text/javascript" src="/static/lib/jquery-1.6.2.min.js"></script>
|
||||
<script type="text/javascript" src="/static/lib/jquery-ui-1.8.16.custom.min.js"></script>
|
||||
<script type="text/javascript" src="/static/lib//swfobject/swfobject.js"></script>
|
||||
<script type="text/javascript" src="/static/lib/jquery.treeview.js"></script>
|
||||
<script type="text/javascript" src="/static/js/video_player.js"></script>
|
||||
<script type="text/javascript" src="/static/js/schematic.js"></script>
|
||||
|
||||
<!-- Warning: Do not upgrade FancyBox. V2.0 is under a non-free CC license -->
|
||||
<script type="text/javascript" src="/static/lib/fancybox/jquery.fancybox-1.3.4.js"></script>
|
||||
<link rel="stylesheet" href="/static/lib/fancybox/jquery.fancybox-1.3.4.css">
|
||||
<script type="text/x-mathjax-config">
|
||||
MathJax.Hub.Config({
|
||||
tex2jax: {inlineMath: [["\\(","\\)"]],
|
||||
displayMath: [["\\[","\\]"]]}
|
||||
});
|
||||
</script>
|
||||
<script type="text/javascript" src="/static/lib/mathjax/MathJax.js?config=TeX-AMS_HTML-full"></script>
|
||||
|
||||
<script>
|
||||
$(function() {
|
||||
@@ -34,21 +34,18 @@ $(function() {
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
${self.body()}
|
||||
<div id="bottomWrapper">
|
||||
<div id="footer">
|
||||
<p style="padding-top:20px"> Copyright
|
||||
(c). 2011. MIT. <a href=http://creativecommons.org/licenses/by-sa/3.0/>Some
|
||||
rights reserved.</a> Please give us <a id="inline"
|
||||
${self.body()}
|
||||
|
||||
<footer>
|
||||
<p> Copyright (c). 2011. MIT. <a href=http://creativecommons.org/licenses/by-sa/3.0/>Some rights reserved.</a> Please give us <a id="inline"
|
||||
href="#feedback_div">feedback</a>. Try our <a id="inline"
|
||||
href="#calculator_div">calculator</a>.
|
||||
|
||||
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Template based on a design from http://www.dotemplate.com/ - Donated $10 (pmitros) so we don't need to include credit. -->
|
||||
</p>
|
||||
|
||||
<div style="display:none"><div id="feedback_div">Found a bug? Got an
|
||||
idea for improving our system? Let us know.
|
||||
@@ -85,10 +82,15 @@ idea for improving our system? Let us know.
|
||||
});</script>
|
||||
<br>
|
||||
Supported operations: ^ * / + - || ()
|
||||
<br>
|
||||
<br>
|
||||
Supported suffixes: %kMGTcmunp
|
||||
|
||||
</div></div>
|
||||
|
||||
<ul>
|
||||
<li><a href="/s/help.html">Help</a></li>
|
||||
<li><a href="/logout">Log out</a></li>
|
||||
</ul>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
97
main.html.orig
Normal file
97
main.html.orig
Normal file
@@ -0,0 +1,97 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>MITX 6.002</title>
|
||||
|
||||
<link rel="stylesheet" href="/static/lib/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"/>
|
||||
|
||||
<script type="text/javascript" src="/static/lib/jquery-1.6.2.min.js"></script>
|
||||
<script type="text/javascript" src="/static/lib/jquery-ui-1.8.16.custom.min.js"></script>
|
||||
<script type="text/javascript" src="/static/lib//swfobject/swfobject.js"></script>
|
||||
<script type="text/javascript" src="/static/lib/jquery.treeview.js"></script>
|
||||
<script type="text/javascript" src="/static/js/video_player.js"></script>
|
||||
<script type="text/javascript" src="/static/js/schematic.js"></script>
|
||||
|
||||
<!-- Warning: Do not upgrade FancyBox. V2.0 is under a non-free CC license -->
|
||||
<script type="text/javascript" src="/static/lib/fancybox/jquery.fancybox-1.3.4.js"></script>
|
||||
<link rel="stylesheet" href="/static/lib/fancybox/jquery.fancybox-1.3.4.css">
|
||||
<script type="text/x-mathjax-config">
|
||||
MathJax.Hub.Config({
|
||||
tex2jax: {inlineMath: [["\\(","\\)"]],
|
||||
displayMath: [["\\[","\\]"]]}
|
||||
});
|
||||
</script>
|
||||
<script type="text/javascript" src="/static/lib/mathjax/MathJax.js?config=TeX-AMS_HTML-full"></script>
|
||||
|
||||
<script>
|
||||
$(function() {
|
||||
// Set up FancyBox pop-ups
|
||||
$("a#inline").fancybox({
|
||||
'hideOnContentClick': false
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
${self.body()}
|
||||
|
||||
<footer>
|
||||
<p> Copyright (c). 2011. MIT. <a href=http://creativecommons.org/licenses/by-sa/3.0/>Some rights reserved.</a> Please give us <a id="inline"
|
||||
href="#feedback_div">feedback</a>. Try our <a id="inline"
|
||||
href="#calculator_div">calculator</a>.
|
||||
|
||||
<!-- Template based on a design from http://www.dotemplate.com/ - Donated $10 (pmitros) so we don't need to include credit. -->
|
||||
</p>
|
||||
|
||||
<div style="display:none"><div id="feedback_div">Found a bug? Got an
|
||||
idea for improving our system? Let us know.
|
||||
<br> Subject: <br><input id="feedback_subject" size=40>
|
||||
<br> Feedback: <br><textarea id="feedback_message" cols="40" rows="5">
|
||||
</textarea>
|
||||
<br> <input id="feedback_button" type="button" value="Submit">
|
||||
|
||||
<script>$(function() {
|
||||
$("#feedback_button").click(function(){
|
||||
postJSON("/send_feedback", {"subject":$("#feedback_subject").attr("value"),
|
||||
"url":document.URL,
|
||||
"message":$("#feedback_message").attr("value")},
|
||||
function(data){
|
||||
$("#feedback_subject").attr("value","");
|
||||
$("#feedback_message").attr("value","");
|
||||
$("#feedback_div").html("Feedback submitted. Thank you");
|
||||
});
|
||||
});
|
||||
});</script>
|
||||
|
||||
</div></div>
|
||||
|
||||
<div style="display:none"><div id="calculator_div">
|
||||
<input id="calculator_input" > <input id="calculator_button" type=button value="=>">
|
||||
<input id="calculator_output" readonly>
|
||||
<script>$(function() {
|
||||
$("#calculator_button").click(function(){
|
||||
$.getJSON("/calculate", {"equation":$("#calculator_input").attr("value")},
|
||||
function(data){
|
||||
$("#calculator_output").attr("value",data.result);
|
||||
});
|
||||
});
|
||||
});</script>
|
||||
<br>
|
||||
Supported operations: ^ * / + - || ()
|
||||
<br>
|
||||
Supported suffixes: %kMGTcmunp
|
||||
|
||||
</div></div>
|
||||
|
||||
<ul>
|
||||
<li><a href="/s/help.html">Help</a></li>
|
||||
<li><a href="/logout">Log out</a></li>
|
||||
</ul>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
15
navigation.html
Normal file
15
navigation.html
Normal file
@@ -0,0 +1,15 @@
|
||||
<div class="header-wrapper">
|
||||
<header>
|
||||
<h1>Circuits and Electronics</h1>
|
||||
|
||||
<nav>
|
||||
<ul class="coursenav">
|
||||
<li><a href="/courseware">Courseware</a></li>
|
||||
<li><a href="/book">Textbook</a></li>
|
||||
<li><a href="/discussion">Discussion</a></li>
|
||||
<li><a href="/wiki">Wiki</a></li>
|
||||
<li><a href="/profile">Profile</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
</div>
|
||||
@@ -1,6 +1,5 @@
|
||||
<h2> ${ problem['name'] } </h2>
|
||||
${ problem['html'] }
|
||||
<br>
|
||||
|
||||
<input type="hidden" name="problem_id" value="${ problem['name'] }">
|
||||
% if check_button:
|
||||
|
||||
108
profile.html
108
profile.html
@@ -62,75 +62,55 @@ $(function() {
|
||||
|
||||
</script>
|
||||
|
||||
<div align="right" id="coursenav"><div align=right><table><tr><td align=right valign=top>
|
||||
<a href="/book">Textbook</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/courseware">Courseware</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/discussion">Discussion</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/wiki">Wiki</a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/profile"><b>Profile</b></a>
|
||||
<span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/s/help.html">Help</a> <span class="ui-icon ui-icon-bullet" style="display:inline-block;"></span>
|
||||
<a href="/logout">Log out</a>
|
||||
</td></tr><tr><td valign=top>
|
||||
</td></tr></table>
|
||||
</div></div>
|
||||
<center>
|
||||
<br><br><br><br>
|
||||
<h1> ${name} </h1>
|
||||
<table><td align=right>Forum name:</td><td>${username}</td></tr>
|
||||
<td align=right>E-mail:</td><td>${email}</td></tr>
|
||||
<tr id="change_location"> <td align=right>Location:</a></td><td><div class="bordered" id="location_sub">${location} </div></td></tr>
|
||||
<tr id="change_language"><td align=right><div id="change_language">Language:</a></td><td><div id="language_sub" class="bordered">${language} </div></td></tr>
|
||||
<tr id="change_password"><td align=right><div>Password:</a></td><td><div id="change_password" class="bordered">********</a></td></tr></table>
|
||||
<%include file="navigation.html" />
|
||||
|
||||
<div><a id="inline" href="#change_password_pop"></a></div> <!-- hidden trigger for password -->
|
||||
<section class="main-content">
|
||||
<div class="profile-wrapper">
|
||||
<section class="user-info">
|
||||
|
||||
<div id="description"></div>
|
||||
<h1>${name}</h1>
|
||||
|
||||
<h1> Course Progress </h1>
|
||||
<table>
|
||||
% for hw in homeworks:
|
||||
<tr><td> ${ hw['chapter'] }</td><td>/</td> <td> ${ hw['section'] } </td><td> </td><td>
|
||||
% for score in hw['scores']:
|
||||
${ score[0] }/${ score[1] }
|
||||
% endfor
|
||||
</td></tr>
|
||||
% endfor
|
||||
</table>
|
||||
</center>
|
||||
<ul>
|
||||
<li>Forum name: ${username}</li>
|
||||
<li>E-mail: ${email}</li>
|
||||
<li>Location: ${location}</li>
|
||||
<li>Language: ${language}</li>
|
||||
<li>Password: ********</li>
|
||||
</ul>
|
||||
|
||||
<div style="display:none"><div id="change_password_pop">
|
||||
<div id="pwd_reset">
|
||||
<table width=400><tr><td> <h1>Password reset</h1>
|
||||
<!-- <div><a href="#change_password_pop">Reset password</a></div> -->
|
||||
<!-- hidden trigger for password -->
|
||||
|
||||
<p>Hit the button below, and we'll e-mail you a password reset link at ${email}.</p>
|
||||
<div id="change_password_pop">
|
||||
<h2>Password reset</h2>
|
||||
|
||||
<p>
|
||||
<div align=right>
|
||||
<input id="id_email" type="hidden" name="email" maxlength="75" value="${email}" />
|
||||
<input type="button" id="pwd_reset_button" value="E-mail me" /></p>
|
||||
</div>
|
||||
</td></tr></table>
|
||||
</div>
|
||||
</div></div>
|
||||
<p>We'll e-mail you a password reset link at ${email}.</p>
|
||||
<input id="id_email" type="hidden" name="email" maxlength="75" value="${email}" />
|
||||
|
||||
<input type="button" id="pwd_reset_button" value="Reset Password" />
|
||||
</div>
|
||||
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
</section>
|
||||
|
||||
<section class="course-info">
|
||||
<h1>Course Progress</h1>
|
||||
|
||||
<!-- <div id="description"></div> -->
|
||||
|
||||
<ol>
|
||||
% for hw in homeworks:
|
||||
<li>
|
||||
<h2>${ hw['chapter'] }</h2>
|
||||
<h3>${ hw['section'] }</h3>
|
||||
|
||||
<ul>
|
||||
% for score in hw['scores']:
|
||||
<li>${ score[0] }/${ score[1] }</li>
|
||||
% endfor
|
||||
</ul>
|
||||
</li>
|
||||
% endfor
|
||||
</ol>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
116
profile.html.orig
Normal file
116
profile.html.orig
Normal file
@@ -0,0 +1,116 @@
|
||||
<%inherit file="main.html" />
|
||||
|
||||
<script>
|
||||
var loc=true; // Activate on clicks? Not if already clicked.
|
||||
var lang=true;
|
||||
$(function() {
|
||||
$("#change_location").click(function() {
|
||||
log_event("profile", {"type":"location_show", "old":$("#location_sub").text()});
|
||||
|
||||
if(loc) {
|
||||
$("#description").html('<div style="color:#FF0000">'+
|
||||
"Preferred format is city, state, country (so for us, "+
|
||||
""Cambridge, Massachusetts, USA"), but give "+
|
||||
"as much or as little detail as you want. </div>");
|
||||
|
||||
loc=false;
|
||||
$("#location_sub").html('<input id="id_loc_text" type="text" name="loc_text" />'+
|
||||
'<input type="button" id="change_loc_button" value="Change" />');
|
||||
$("#change_loc_button").click(function() {
|
||||
postJSON('/change_setting', {'location':$("#id_loc_text").attr("value")}, function(json) {
|
||||
$("#location_sub").text(json.location);
|
||||
loc=true;
|
||||
$("#description").html("");
|
||||
log_event("profile", {"type":"location_change", "new":json.location});
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$("#change_language").click(function() {
|
||||
log_event("profile", {"type":"language_show", "old":$("#language_sub").text()});
|
||||
|
||||
if(lang) {
|
||||
lang=false;
|
||||
$("#language_sub").html('<input id="id_lang_text" type="text" name="lang_text" />'+
|
||||
'<input type="button" id="change_lang_button" value="Change" />');
|
||||
$("#change_lang_button").click(function() {
|
||||
postJSON('/change_setting', {'language':$("#id_lang_text").attr("value")}, function(json) {
|
||||
$("#language_sub").text(json.language);
|
||||
lang=true;
|
||||
$("#description").html("");
|
||||
log_event("profile", {"type":"language_change", "new":json.language});
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
$('#change_password').click(function(){
|
||||
$('#inline').trigger('click');
|
||||
log_event("profile", {"type":"password_show"});
|
||||
});
|
||||
|
||||
$('#pwd_reset_button').click(function() {
|
||||
$.post('/password_reset/',{ "csrfmiddlewaretoken" : "${ csrf }",
|
||||
"email" : $('#id_email').val()}, function(data){
|
||||
$('#pwd_reset').html(data);
|
||||
log_event("profile", {"type":"password_send"});
|
||||
});
|
||||
});
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<%include file="navigation.html" />
|
||||
|
||||
<section class="main-content">
|
||||
<div class="profile-wrapper">
|
||||
<section class="user-info">
|
||||
|
||||
<h1>${name}</h1>
|
||||
|
||||
<ul>
|
||||
<li>Forum name: ${username}</li>
|
||||
<li>E-mail: ${email}</li>
|
||||
<li>Location: ${location}</li>
|
||||
<li>Language: ${language}</li>
|
||||
<li>Password: ********</li>
|
||||
</ul>
|
||||
|
||||
<!-- <div><a href="#change_password_pop">Reset password</a></div> -->
|
||||
<!-- hidden trigger for password -->
|
||||
|
||||
<div id="change_password_pop">
|
||||
<h2>Password reset</h2>
|
||||
|
||||
<p>We'll e-mail you a password reset link at ${email}.</p>
|
||||
<input id="id_email" type="hidden" name="email" maxlength="75" value="${email}" />
|
||||
|
||||
<input type="button" id="pwd_reset_button" value="Reset Password" />
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<section class="course-info">
|
||||
<h1>Course Progress</h1>
|
||||
|
||||
<!-- <div id="description"></div> -->
|
||||
|
||||
<ol>
|
||||
% for hw in homeworks:
|
||||
<li>
|
||||
<h2>${ hw['chapter'] }</h2>
|
||||
<h3>${ hw['section'] }</h3>
|
||||
|
||||
<ul>
|
||||
% for score in hw['scores']:
|
||||
<li>${ score[0] }/${ score[1] }</li>
|
||||
% endfor
|
||||
</ul>
|
||||
</li>
|
||||
% endfor
|
||||
</ol>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
BIN
sass/.DS_Store
vendored
Normal file
BIN
sass/.DS_Store
vendored
Normal file
Binary file not shown.
32
sass/_base-extends.scss
Normal file
32
sass/_base-extends.scss
Normal file
@@ -0,0 +1,32 @@
|
||||
.clearfix:after {
|
||||
content: ".";
|
||||
display: block;
|
||||
height: 0;
|
||||
clear: both;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
margin: 0 auto;
|
||||
max-width: $max-width;
|
||||
width: grid-width(12);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.button {
|
||||
@include box-shadow(inset 0 1px 0 lighten($mit-red, 10%), 0 0 3px #ccc);
|
||||
@include linear-gradient(lighten($mit-red, 5%), darken($mit-red, 5%));
|
||||
@include border-radius(3px);
|
||||
border: 1px solid darken($mit-red, 10%);
|
||||
padding: 10px 15px;
|
||||
color: #fff;
|
||||
font: bold $body-font-size $body-font-family;
|
||||
text-shadow: 0 1px 0 darken($mit-red, 10%);
|
||||
cursor: pointer;
|
||||
|
||||
&:hover, &:focus {
|
||||
@include box-shadow(inset 0 1px 0 lighten($mit-red, 20%), 0 0 3px #ccc);
|
||||
@include linear-gradient(lighten($mit-red, 10%), darken($mit-red, 5%));
|
||||
border: 1px solid darken($mit-red, 20%);
|
||||
}
|
||||
}
|
||||
34
sass/_base-variables.scss
Normal file
34
sass/_base-variables.scss
Normal file
@@ -0,0 +1,34 @@
|
||||
// Percentage of container calculator
|
||||
@function perc($width, $container-width: $max-width) {
|
||||
@return percentage($width / $container-width);
|
||||
}
|
||||
|
||||
// Line-height
|
||||
@function lh($amount: 1) {
|
||||
@return $base-line-height * $amount;
|
||||
}
|
||||
|
||||
// Variables
|
||||
// ---------------------------------------- //
|
||||
|
||||
// fonts
|
||||
$body-font-family: "Droid Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;;
|
||||
$body-font-size: 14px;
|
||||
|
||||
// grid
|
||||
$columns: 12;
|
||||
$column-width: 80px;
|
||||
$gutter-width: 25px;
|
||||
$max-width: ($columns * $column-width) + (($columns - 1) * $gutter-width);
|
||||
|
||||
$gw-column: perc($column-width);
|
||||
$gw-gutter: perc($gutter-width);
|
||||
$body-line-height: golden-ratio($body-font-size, 1);
|
||||
|
||||
// color
|
||||
$light-gray: #ddd;
|
||||
$dark-gray: #333;
|
||||
$mit-red: #993333;
|
||||
|
||||
$text-color: $dark-gray;
|
||||
$border-color: $light-gray;
|
||||
33
sass/_base.scss
Normal file
33
sass/_base.scss
Normal file
@@ -0,0 +1,33 @@
|
||||
h1 {
|
||||
|
||||
}
|
||||
|
||||
h2 {
|
||||
|
||||
}
|
||||
|
||||
h3 {
|
||||
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: $body-line-height;
|
||||
}
|
||||
|
||||
#{$all-text-inputs}, textarea {
|
||||
@include border-radius(3px);
|
||||
@include box-shadow(0 -1px 0 #fff);
|
||||
@include linear-gradient(#eee, #fff);
|
||||
border: 1px solid #bbb;
|
||||
font: $body-font-size $body-font-family;
|
||||
padding: 8px;
|
||||
|
||||
&:focus {
|
||||
border-color: $mit-red;
|
||||
}
|
||||
}
|
||||
|
||||
input[type="submit"], input[type="button"], button {
|
||||
// @extend .button;
|
||||
}
|
||||
|
||||
157
sass/_courseware.scss
Normal file
157
sass/_courseware.scss
Normal file
@@ -0,0 +1,157 @@
|
||||
div.course-wrapper {
|
||||
display: table;
|
||||
width: 100%;
|
||||
|
||||
div#accordion {
|
||||
@include box-shadow( inset -1px 0 0 #f6f6f6);
|
||||
background: #e3e3e3;
|
||||
border-right: 1px solid #d3d3d3;
|
||||
display: table-cell;
|
||||
font-family: $body-font-family;
|
||||
text-shadow: 0 1px 0 #f6f6f6;
|
||||
vertical-align: top;
|
||||
width: grid-width(3);
|
||||
|
||||
h3 {
|
||||
&.ui-accordion-header {
|
||||
color: #000;
|
||||
|
||||
a {
|
||||
font-size: $body-font-size;
|
||||
color: lighten($text-color, 10%);
|
||||
}
|
||||
|
||||
&.ui-state-default {
|
||||
background: none;
|
||||
font-weight: normal;
|
||||
border: none;
|
||||
border-bottom: 1px solid #d3d3d3;
|
||||
@include box-shadow(0 1px 0 #eee);
|
||||
}
|
||||
|
||||
&.ui-state-hover {
|
||||
border: none;
|
||||
border-bottom: 1px solid #d3d3d3;
|
||||
}
|
||||
|
||||
&.ui-state-active {
|
||||
@include box-shadow(none);
|
||||
background: none;
|
||||
border: 0;
|
||||
border-bottom: 1px solid #aaa;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
|
||||
a {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul.ui-accordion-content {
|
||||
@include border-radius(0);
|
||||
@include box-shadow( inset -1px 0 0 #e6e6e6);
|
||||
background: #d6d6d6;
|
||||
border-bottom: 1px solid #c3c3c3;
|
||||
border-top: 1px solid #c3c3c3;
|
||||
border: none;
|
||||
font-size: 12px;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
&.active {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section.course-content {
|
||||
@include box-sizing(border-box);
|
||||
display: table-cell;
|
||||
padding: $gw-gutter;
|
||||
vertical-align: top;
|
||||
width: grid-width(9);
|
||||
|
||||
ol.vert-mod {
|
||||
li {
|
||||
@extend .clearfix;
|
||||
}
|
||||
}
|
||||
|
||||
ol.sequence-nav {
|
||||
margin-bottom: $body-line-height;
|
||||
|
||||
li {
|
||||
cursor: pointer;
|
||||
display: table-cell;
|
||||
min-width: 30px;
|
||||
min-height: 30px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
div.video-wrapper {
|
||||
float: left;
|
||||
width: 640px;
|
||||
min-height: 500px;
|
||||
|
||||
section {
|
||||
ul {
|
||||
display: inline-block;
|
||||
|
||||
li {
|
||||
margin-top: 5px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
|
||||
div {
|
||||
&:empty {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div#slider {
|
||||
margin: -14px 0 10px 60px;
|
||||
}
|
||||
|
||||
div#vidtime {
|
||||
float: left;
|
||||
}
|
||||
|
||||
div#video_speeds {
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
|
||||
span {
|
||||
&:hover {
|
||||
color: $mit-red;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ol.subtitles {
|
||||
width: 220px;
|
||||
margin-left: 20px;
|
||||
float: left;
|
||||
|
||||
li {
|
||||
margin-bottom: 8px;
|
||||
cursor: pointer;
|
||||
|
||||
&.current {
|
||||
background-color: #f3f3f3;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $mit-red;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
12
sass/_font-face.scss
Normal file
12
sass/_font-face.scss
Normal file
@@ -0,0 +1,12 @@
|
||||
@font-face {
|
||||
font-family: 'Droid Sans';
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
src: local('Droid Sans'), local('DroidSans'), url('http://themes.googleusercontent.com/static/fonts/droidsans/v3/s-BiyweUPV0v-yRb-cjciL3hpw3pgy2gAi-Ip7WPMi0.woff') format('woff');
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Droid Sans';
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
src: local('Droid Sans Bold'), local('DroidSans-Bold'), url('http://themes.googleusercontent.com/static/fonts/droidsans/v3/EFpQQyG9GqCrobXxL-KRMXbFhgvWbfSbdVg11QabG8w.woff') format('woff');
|
||||
}
|
||||
111
sass/_layout.scss
Normal file
111
sass/_layout.scss
Normal file
@@ -0,0 +1,111 @@
|
||||
html {
|
||||
margin-top: 0;
|
||||
|
||||
body {
|
||||
color: $dark-gray;
|
||||
font: $body-font-size $body-font-family;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
background: #f3f3f3;
|
||||
|
||||
div.header-wrapper {
|
||||
@include box-shadow(inset 0 1px 0 lighten($mit-red, 10%), 0 1px 1px #ccc);
|
||||
@include linear-gradient(lighten($mit-red, 5%), darken($mit-red, 5%));
|
||||
border-bottom: 1px solid darken($mit-red, 10%);
|
||||
|
||||
header {
|
||||
@extend .clearfix;
|
||||
@extend .wrapper;
|
||||
@include box-sizing(border-box);
|
||||
padding: 0 $body-line-height;
|
||||
|
||||
h1 {
|
||||
border-right: 1px solid darken($mit-red, 5%);
|
||||
font-size: $body-font-size;
|
||||
font-weight: bold;
|
||||
margin: 0 $gw-gutter 0 0;
|
||||
padding: 15px $gw-gutter 15px 0;
|
||||
display: block;
|
||||
float: left;
|
||||
color: #000;
|
||||
text-shadow: 0 1px 0 lighten($mit-red, 10%);
|
||||
}
|
||||
|
||||
nav {
|
||||
float: left;
|
||||
display: block;
|
||||
margin: 0;
|
||||
text-shadow: 0 -1px 0 darken($mit-red, 10%);
|
||||
|
||||
ul {
|
||||
@extend .clearfix;
|
||||
display: inline-block;
|
||||
padding: 15px 0;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
margin-right: $body-line-height;
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
|
||||
a {
|
||||
color: #fff;
|
||||
|
||||
&:hover {
|
||||
color: rgba(#fff, .7);
|
||||
background-color: none;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section.main-content {
|
||||
@extend .clearfix;
|
||||
@extend .wrapper;
|
||||
@include box-shadow(0 1px 0 #fff);
|
||||
@include box-sizing(border-box);
|
||||
background: #fff;
|
||||
border-top: 0;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
float: right;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
margin-right: 20px;
|
||||
|
||||
a {
|
||||
color: #444;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
37
sass/_local.scss
Normal file
37
sass/_local.scss
Normal file
@@ -0,0 +1,37 @@
|
||||
#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_video_visited { background-color: #cccaac;}
|
||||
.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;}
|
||||
28
sass/_profile.scss
Normal file
28
sass/_profile.scss
Normal file
@@ -0,0 +1,28 @@
|
||||
div.profile-wrapper {
|
||||
display: table;
|
||||
|
||||
section.user-info {
|
||||
@include box-sizing(border-box);
|
||||
margin-right: $gw-gutter;
|
||||
padding: $body-line-height;
|
||||
width: grid-width(6);
|
||||
background: #e3e3e3;
|
||||
border-right: 1px solid #d3d3d3;
|
||||
text-shadow: 0 1px 0 #f6f6f6;
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
section.course-info {
|
||||
@include box-sizing(border-box);
|
||||
padding: $body-line-height;
|
||||
width: grid-width(6);
|
||||
display: table-cell;
|
||||
|
||||
ul {
|
||||
li {
|
||||
display: inline-block;
|
||||
padding-right: 1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
47
sass/_reset.scss
Normal file
47
sass/_reset.scss
Normal file
@@ -0,0 +1,47 @@
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
font-weight: inherit;
|
||||
font-style: inherit;
|
||||
font-size: 100%;
|
||||
font-family: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
/* remember to define focus styles! */
|
||||
:focus {
|
||||
outline: 0;
|
||||
}
|
||||
body {
|
||||
line-height: 1;
|
||||
color: black;
|
||||
background: white;
|
||||
}
|
||||
ol, ul {
|
||||
list-style: none;
|
||||
}
|
||||
/* tables still need 'cellspacing="0"' in the markup */
|
||||
table {
|
||||
border-collapse: separate;
|
||||
border-spacing: 0;
|
||||
}
|
||||
caption, th, td {
|
||||
text-align: left;
|
||||
font-weight: normal;
|
||||
}
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {
|
||||
content: "";
|
||||
}
|
||||
blockquote, q {
|
||||
quotes: "" "";
|
||||
}
|
||||
|
||||
69
sass/_textbook.scss
Normal file
69
sass/_textbook.scss
Normal file
@@ -0,0 +1,69 @@
|
||||
div.book-wrapper {
|
||||
display: table;
|
||||
|
||||
ul#booknav {
|
||||
@include box-shadow( inset -1px 0 0 #f6f6f6);
|
||||
@include box-sizing(border-box);
|
||||
background: #e3e3e3;
|
||||
border-right: 1px solid #d3d3d3;
|
||||
font-family: $body-font-family;
|
||||
padding: $body-line-height;
|
||||
text-shadow: 0 1px 0 #f6f6f6;
|
||||
vertical-align: top;
|
||||
width: grid-width(3);
|
||||
min-width: 240px;
|
||||
display: table-cell;
|
||||
|
||||
li {
|
||||
ul {
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section.book {
|
||||
@include box-sizing(border-box);
|
||||
padding: $body-line-height;
|
||||
vertical-align: top;
|
||||
width: grid-width(9) + $gw-gutter;
|
||||
display: table-cell;
|
||||
|
||||
nav {
|
||||
background: #F6EFD4;
|
||||
border-bottom: 1px solid darken(#F6EFD4, 10%);
|
||||
margin: (-$body-line-height) (-$body-line-height) $body-line-height;
|
||||
|
||||
ul {
|
||||
@extend .clearfix;
|
||||
li {
|
||||
padding: 15px;
|
||||
|
||||
&.last {
|
||||
float: left;
|
||||
}
|
||||
|
||||
&.next {
|
||||
float: right;
|
||||
}
|
||||
|
||||
a {
|
||||
font-size: 12px;
|
||||
text-transform: uppercase;
|
||||
color: darken(#F6EFD4, 80%);
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
|
||||
&:hover {
|
||||
color: darken(#F6EFD4, 60%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section.page {
|
||||
img {
|
||||
border: 1px solid $border-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
206
sass/_theme.scss
Normal file
206
sass/_theme.scss
Normal file
@@ -0,0 +1,206 @@
|
||||
/*
|
||||
----------------------------------------------------------------------------------------
|
||||
|
||||
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;
|
||||
|
||||
----------------------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
body {
|
||||
font-family: Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size:1.6em;
|
||||
margin:25px 0 10px 0;
|
||||
clear:both;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size:1.1em;
|
||||
margin:20px 0 10px 0;
|
||||
clear:both;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size:1em;
|
||||
margin:20px 0 5px 0;
|
||||
clear:both;
|
||||
}
|
||||
|
||||
a:link, a:visited {
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration:underline;
|
||||
}
|
||||
|
||||
#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; }
|
||||
16
sass/application.scss
Normal file
16
sass/application.scss
Normal file
@@ -0,0 +1,16 @@
|
||||
@import "bourbon/bourbon";
|
||||
@import "reset";
|
||||
@import "font-face";
|
||||
|
||||
// Base layout
|
||||
@import "base-variables", "base-extends", "base";
|
||||
@import "layout";
|
||||
|
||||
// pages
|
||||
@import "courseware";
|
||||
@import "textbook";
|
||||
@import "profile";
|
||||
|
||||
// left over
|
||||
@import "theme";
|
||||
@import "local";
|
||||
29
sass/bourbon/_bourbon.scss
vendored
Normal file
29
sass/bourbon/_bourbon.scss
vendored
Normal file
@@ -0,0 +1,29 @@
|
||||
// Custom Functions
|
||||
@import "functions/deprecated-webkit-gradient";
|
||||
@import "functions/golden-ratio";
|
||||
@import "functions/grid-width";
|
||||
@import "functions/tint-shade";
|
||||
|
||||
// CSS3 Mixins
|
||||
@import "css3/animation";
|
||||
@import "css3/appearance";
|
||||
@import "css3/background-image";
|
||||
@import "css3/background-size";
|
||||
@import "css3/border-image";
|
||||
@import "css3/border-radius";
|
||||
@import "css3/box-shadow";
|
||||
@import "css3/box-sizing";
|
||||
@import "css3/columns";
|
||||
@import "css3/flex-box";
|
||||
@import "css3/inline-block";
|
||||
@import "css3/linear-gradient";
|
||||
@import "css3/radial-gradient";
|
||||
@import "css3/transform";
|
||||
@import "css3/transition";
|
||||
|
||||
// Addons & other mixins
|
||||
@import "addons/button";
|
||||
@import "addons/font-family";
|
||||
@import "addons/html5-input-types";
|
||||
@import "addons/position";
|
||||
@import "addons/timing-functions";
|
||||
170
sass/bourbon/addons/_button.scss
vendored
Normal file
170
sass/bourbon/addons/_button.scss
vendored
Normal file
@@ -0,0 +1,170 @@
|
||||
@mixin button ($style: simple, $base-color: #4294f0) {
|
||||
|
||||
@if type-of($style) == color {
|
||||
$base-color: $style;
|
||||
$style: simple;
|
||||
}
|
||||
|
||||
@if $style == simple {
|
||||
@include simple($base-color);
|
||||
}
|
||||
|
||||
@else if $style == shiny {
|
||||
@include shiny($base-color);
|
||||
}
|
||||
|
||||
@else if $style == pill {
|
||||
@include pill($base-color);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin simple ($base-color) {
|
||||
$stop-gradient: adjust-color($base-color, $saturation: 9%, $lightness: -11%);
|
||||
$border: adjust-color($base-color, $saturation: 9%, $lightness: -14%);
|
||||
$color: hsl(0, 0, 100%);
|
||||
$inset-shadow: adjust-color($base-color, $saturation: -8%, $lightness: 15%);
|
||||
$text-shadow: adjust-color($base-color, $saturation: 15%, $lightness: -18%);
|
||||
|
||||
@if lightness($base-color) > 70% {
|
||||
$color: hsl(0, 0, 20%);
|
||||
$text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%);
|
||||
}
|
||||
|
||||
border: 1px solid $border;
|
||||
@include border-radius (3px);
|
||||
@include box-shadow (inset 0 1px 0 0 $inset-shadow);
|
||||
color: $color;
|
||||
display: inline;
|
||||
font-size: 11px;
|
||||
font-weight: bold;
|
||||
@include linear-gradient ($base-color, $stop-gradient);
|
||||
padding: 6px 18px 7px;
|
||||
text-shadow: 0 1px 0 $text-shadow;
|
||||
-webkit-background-clip: padding-box;
|
||||
|
||||
&:hover {
|
||||
$base-color-hover: adjust-color($base-color, $saturation: -4%, $lightness: -5%);
|
||||
$stop-gradient-hover: adjust-color($base-color, $saturation: 8%, $lightness: -14%);
|
||||
$inset-shadow-hover: adjust-color($base-color, $saturation: -7%, $lightness: 5%);
|
||||
|
||||
@include box-shadow (inset 0 1px 0 0 $inset-shadow-hover);
|
||||
cursor: pointer;
|
||||
@include linear-gradient ($base-color-hover, $stop-gradient-hover);
|
||||
}
|
||||
|
||||
&:active {
|
||||
$border-active: adjust-color($base-color, $saturation: 9%, $lightness: -14%);
|
||||
$inset-shadow-active: adjust-color($base-color, $saturation: 7%, $lightness: -17%);
|
||||
|
||||
border: 1px solid $border-active;
|
||||
@include box-shadow (inset 0 0 8px 4px $inset-shadow-active, inset 0 0 8px 4px $inset-shadow-active, 0 1px 1px 0 #eee);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin shiny($base-color) {
|
||||
$second-stop: adjust-color($base-color, $red: -56, $green: -50, $blue: -33);
|
||||
$third-stop: adjust-color($base-color, $red: -86, $green: -75, $blue: -48);
|
||||
$fourth-stop: adjust-color($base-color, $red: -79, $green: -70, $blue: -46);
|
||||
$border: adjust-color($base-color, $red: -117, $green: -111, $blue: -81);
|
||||
$border-bottom: adjust-color($base-color, $red: -126, $green: -127, $blue: -122);
|
||||
$color: hsl(0, 0, 100%);
|
||||
$inset-shadow: adjust-color($base-color, $red: 37, $green: 29, $blue: 12);
|
||||
$text-shadow: adjust-color($base-color, $red: -140, $green: -141, $blue: -114);
|
||||
|
||||
@if lightness($base-color) > 70% {
|
||||
$color: hsl(0, 0, 20%);
|
||||
$text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%);
|
||||
}
|
||||
|
||||
@include linear-gradient(top, $base-color 0%, $second-stop 50%, $third-stop 50%, $fourth-stop 100%);
|
||||
border: 1px solid $border;
|
||||
border-bottom: 1px solid $border-bottom;
|
||||
@include border-radius(5px);
|
||||
@include box-shadow(inset 0 1px 0 0 $inset-shadow);
|
||||
color: $color;
|
||||
display: inline;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
padding: 7px 20px 8px;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
text-shadow: 0 -1px 1px $text-shadow;
|
||||
|
||||
&:hover {
|
||||
$first-stop-hover: adjust-color($base-color, $red: -13, $green: -15, $blue: -18);
|
||||
$second-stop-hover: adjust-color($base-color, $red: -66, $green: -62, $blue: -51);
|
||||
$third-stop-hover: adjust-color($base-color, $red: -93, $green: -85, $blue: -66);
|
||||
$fourth-stop-hover: adjust-color($base-color, $red: -86, $green: -80, $blue: -63);
|
||||
|
||||
@include linear-gradient(top, $first-stop-hover 0%, $second-stop-hover 50%, $third-stop-hover 50%, $fourth-stop-hover 100%);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&:active {
|
||||
$inset-shadow-active: adjust-color($base-color, $red: -111, $green: -116, $blue: -122);
|
||||
|
||||
@include box-shadow(inset 0 0 20px 0 $inset-shadow-active, 0 1px 0 #fff);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin pill($base-color) {
|
||||
$stop-gradient: adjust-color($base-color, $hue: 8, $saturation: 14%, $lightness: -10%);
|
||||
$border-top: adjust-color($base-color, $hue: -1, $saturation: -30%, $lightness: -15%);
|
||||
$border-sides: adjust-color($base-color, $hue: 4, $saturation: -21%, $lightness: -21%);
|
||||
$border-bottom: adjust-color($base-color, $hue: 8, $saturation: -11%, $lightness: -26%);
|
||||
$color: hsl(0, 0, 100%);
|
||||
$inset-shadow: adjust-color($base-color, $hue: -1, $saturation: -1%, $lightness: 7%);
|
||||
$text-shadow: adjust-color($base-color, $hue: 5, $saturation: -19%, $lightness: -15%);
|
||||
|
||||
@if lightness($base-color) > 70% {
|
||||
$color: hsl(0, 0, 20%);
|
||||
$text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%);
|
||||
}
|
||||
|
||||
@include linear-gradient ($base-color, $stop-gradient);
|
||||
border: 1px solid $border-top;
|
||||
border-color: $border-top $border-sides $border-bottom;
|
||||
@include border-radius(16px);
|
||||
@include box-shadow(inset 0 1px 0 0 $inset-shadow, 0 1px 2px 0 #b3b3b3);
|
||||
color: $color;
|
||||
display: inline;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
line-height: 1;
|
||||
padding: 3px 16px 5px;
|
||||
text-align: center;
|
||||
text-shadow: 0 -1px 1px $text-shadow;
|
||||
-webkit-background-clip: padding-box;
|
||||
|
||||
&:hover {
|
||||
$base-color-hover: adjust-color($base-color, $lightness: -4.5%);
|
||||
$stop-gradient-hover: adjust-color($base-color, $hue: 8, $saturation: -4%, $lightness: -15.5%);
|
||||
$border-top: adjust-color($base-color, $hue: -1, $saturation: -17%, $lightness: -21%);
|
||||
$border-sides: adjust-color($base-color, $hue: 4, $saturation: -2%, $lightness: -27%);
|
||||
$border-bottom: adjust-color($base-color, $hue: 8, $saturation: 13.5%, $lightness: -32%);
|
||||
$inset-shadow-hover: adjust-color($base-color, $saturation: -1%, $lightness: 3%);
|
||||
$text-shadow-hover: adjust-color($base-color, $hue: 5, $saturation: -5%, $lightness: -22%);
|
||||
|
||||
@include linear-gradient ($base-color-hover, $stop-gradient-hover);
|
||||
border: 1px solid $border-top;
|
||||
border-color: $border-top $border-sides $border-bottom;
|
||||
@include box-shadow(inset 0 1px 0 0 $inset-shadow-hover);
|
||||
cursor: pointer;
|
||||
text-shadow: 0 -1px 1px $text-shadow-hover;
|
||||
-webkit-background-clip: padding-box;
|
||||
}
|
||||
|
||||
&:active {
|
||||
$active-color: adjust-color($base-color, $hue: 4, $saturation: -12%, $lightness: -10%);
|
||||
$border-active: adjust-color($base-color, $hue: 6, $saturation: -2.5%, $lightness: -30%);
|
||||
$border-bottom-active: adjust-color($base-color, $hue: 11, $saturation: 6%, $lightness: -31%);
|
||||
$inset-shadow-active: adjust-color($base-color, $hue: 9, $saturation: 2%, $lightness: -21.5%);
|
||||
$text-shadow-active: adjust-color($base-color, $hue: 5, $saturation: -12%, $lightness: -21.5%);
|
||||
|
||||
background: $active-color;
|
||||
border: 1px solid $border-active;
|
||||
border-bottom: 1px solid $border-bottom-active;
|
||||
@include box-shadow(inset 0 0 6px 3px $inset-shadow-active, 0 1px 0 0 #fff);
|
||||
text-shadow: 0 -1px 1px $text-shadow-active;
|
||||
}
|
||||
}
|
||||
4
sass/bourbon/addons/_font-family.scss
vendored
Normal file
4
sass/bourbon/addons/_font-family.scss
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
$georgia: Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
$helvetica: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
$lucida-grande: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
|
||||
$verdana: Verdana, Geneva, sans-serif;
|
||||
36
sass/bourbon/addons/_html5-input-types.scss
vendored
Normal file
36
sass/bourbon/addons/_html5-input-types.scss
vendored
Normal file
@@ -0,0 +1,36 @@
|
||||
//************************************************************************//
|
||||
// Generate a variable ($all-text-inputs) with a list of all html5
|
||||
// input types that have a text-based input, excluding textarea.
|
||||
// http://diveintohtml5.org/forms.html
|
||||
//************************************************************************//
|
||||
$inputs-list: 'input[type="email"]',
|
||||
'input[type="number"]',
|
||||
'input[type="password"]',
|
||||
'input[type="search"]',
|
||||
'input[type="tel"]',
|
||||
'input[type="text"]',
|
||||
'input[type="url"]',
|
||||
|
||||
// Webkit & Gecko may change the display of these in the future
|
||||
'input[type="color"]',
|
||||
'input[type="date"]',
|
||||
'input[type="datetime"]',
|
||||
'input[type="datetime-local"]',
|
||||
'input[type="month"]',
|
||||
'input[type="time"]',
|
||||
'input[type="week"]';
|
||||
|
||||
$unquoted-inputs-list: ();
|
||||
|
||||
@each $input-type in $inputs-list {
|
||||
$unquoted-inputs-list: append($unquoted-inputs-list, unquote($input-type), comma);
|
||||
}
|
||||
|
||||
$all-text-inputs: $unquoted-inputs-list;
|
||||
|
||||
// You must use interpolation on the variable:
|
||||
// #{$all-text-inputs}
|
||||
//************************************************************************//
|
||||
// #{$all-text-inputs}, textarea {
|
||||
// border: 1px solid red;
|
||||
// }
|
||||
30
sass/bourbon/addons/_position.scss
vendored
Normal file
30
sass/bourbon/addons/_position.scss
vendored
Normal file
@@ -0,0 +1,30 @@
|
||||
@mixin position ($position: relative, $coordinates: 0 0 0 0) {
|
||||
|
||||
@if type-of($position) == list {
|
||||
$coordinates: $position;
|
||||
$position: relative;
|
||||
}
|
||||
|
||||
$top: nth($coordinates, 1);
|
||||
$right: nth($coordinates, 2);
|
||||
$bottom: nth($coordinates, 3);
|
||||
$left: nth($coordinates, 4);
|
||||
|
||||
position: $position;
|
||||
|
||||
@if not(unitless($top)) {
|
||||
top: $top;
|
||||
}
|
||||
|
||||
@if not(unitless($right)) {
|
||||
right: $right;
|
||||
}
|
||||
|
||||
@if not(unitless($bottom)) {
|
||||
bottom: $bottom;
|
||||
}
|
||||
|
||||
@if not(unitless($left)) {
|
||||
left: $left;
|
||||
}
|
||||
}
|
||||
32
sass/bourbon/addons/_timing-functions.scss
vendored
Normal file
32
sass/bourbon/addons/_timing-functions.scss
vendored
Normal file
@@ -0,0 +1,32 @@
|
||||
// CSS cubic-bezier timing functions. Timing functions courtesy of jquery.easie (github.com/jaukia/easie)
|
||||
// Timing functions are the same as demo'ed here: http://jqueryui.com/demos/effect/easing.html
|
||||
|
||||
// EASE IN
|
||||
$ease-in-quad: cubic-bezier(0.550, 0.085, 0.680, 0.530);
|
||||
$ease-in-cubic: cubic-bezier(0.550, 0.055, 0.675, 0.190);
|
||||
$ease-in-quart: cubic-bezier(0.895, 0.030, 0.685, 0.220);
|
||||
$ease-in-quint: cubic-bezier(0.755, 0.050, 0.855, 0.060);
|
||||
$ease-in-sine: cubic-bezier(0.470, 0.000, 0.745, 0.715);
|
||||
$ease-in-expo: cubic-bezier(0.950, 0.050, 0.795, 0.035);
|
||||
$ease-in-circ: cubic-bezier(0.600, 0.040, 0.980, 0.335);
|
||||
$ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
|
||||
|
||||
// EASE OUT
|
||||
$ease-out-quad: cubic-bezier(0.250, 0.460, 0.450, 0.940);
|
||||
$ease-out-cubic: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||
$ease-out-quart: cubic-bezier(0.165, 0.840, 0.440, 1.000);
|
||||
$ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
|
||||
$ease-out-sine: cubic-bezier(0.390, 0.575, 0.565, 1.000);
|
||||
$ease-out-expo: cubic-bezier(0.190, 1.000, 0.220, 1.000);
|
||||
$ease-out-circ: cubic-bezier(0.075, 0.820, 0.165, 1.000);
|
||||
$ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
|
||||
|
||||
// EASE IN OUT
|
||||
$ease-in-out-quad: cubic-bezier(0.455, 0.030, 0.515, 0.955);
|
||||
$ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
$ease-in-out-quart: cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
||||
$ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
|
||||
$ease-in-out-sine: cubic-bezier(0.445, 0.050, 0.550, 0.950);
|
||||
$ease-in-out-expo: cubic-bezier(1.000, 0.000, 0.000, 1.000);
|
||||
$ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.150, 0.860);
|
||||
$ease-in-out-back: cubic-bezier(0.680, -0.550, 0.265, 1.550);
|
||||
161
sass/bourbon/css3/_animation.scss
vendored
Normal file
161
sass/bourbon/css3/_animation.scss
vendored
Normal file
@@ -0,0 +1,161 @@
|
||||
// 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.
|
||||
|
||||
@mixin animation-name ($name-1,
|
||||
$name-2: false, $name-3: false,
|
||||
$name-4: false, $name-5: false,
|
||||
$name-6: false, $name-7: false,
|
||||
$name-8: false, $name-9: false)
|
||||
{
|
||||
$full: compact($name-1, $name-2, $name-3, $name-4,
|
||||
$name-5, $name-6, $name-7, $name-8, $name-9);
|
||||
|
||||
-webkit-animation-name: $full;
|
||||
-moz-animation-name: $full;
|
||||
animation-name: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-duration ($time-1: 0,
|
||||
$time-2: false, $time-3: false,
|
||||
$time-4: false, $time-5: false,
|
||||
$time-6: false, $time-7: false,
|
||||
$time-8: false, $time-9: false)
|
||||
{
|
||||
$full: compact($time-1, $time-2, $time-3, $time-4,
|
||||
$time-5, $time-6, $time-7, $time-8, $time-9);
|
||||
|
||||
-webkit-animation-duration: $full;
|
||||
-moz-animation-duration: $full;
|
||||
animation-duration: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-timing-function ($motion-1: ease,
|
||||
// ease | linear | ease-in | ease-out | ease-in-out
|
||||
$motion-2: false, $motion-3: false,
|
||||
$motion-4: false, $motion-5: false,
|
||||
$motion-6: false, $motion-7: false,
|
||||
$motion-8: false, $motion-9: false)
|
||||
{
|
||||
$full: compact($motion-1, $motion-2, $motion-3, $motion-4,
|
||||
$motion-5, $motion-6, $motion-7, $motion-8, $motion-9);
|
||||
|
||||
-webkit-animation-timing-function: $full;
|
||||
-moz-animation-timing-function: $full;
|
||||
animation-timing-function: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-iteration-count ($value-1: 1,
|
||||
// infinite | <number>
|
||||
$value-2: false, $value-3: false,
|
||||
$value-4: false, $value-5: false,
|
||||
$value-6: false, $value-7: false,
|
||||
$value-8: false, $value-9: false)
|
||||
{
|
||||
$full: compact($value-1, $value-2, $value-3, $value-4,
|
||||
$value-5, $value-6, $value-7, $value-8, $value-9);
|
||||
|
||||
-webkit-animation-iteration-count: $full;
|
||||
-moz-animation-iteration-count: $full;
|
||||
animation-iteration-count: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-direction ($direction-1: normal,
|
||||
// normal | alternate
|
||||
$direction-2: false, $direction-3: false,
|
||||
$direction-4: false, $direction-5: false,
|
||||
$direction-6: false, $direction-7: false,
|
||||
$direction-8: false, $direction-9: false)
|
||||
{
|
||||
$full: compact($direction-1, $direction-2, $direction-3, $direction-4,
|
||||
$direction-5, $direction-6, $direction-7, $direction-8, $direction-9);
|
||||
|
||||
-webkit-animation-direction: $full;
|
||||
-moz-animation-direction: $full;
|
||||
animation-direction: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-play-state ($state-1: running,
|
||||
// running | paused
|
||||
$state-2: false, $state-3: false,
|
||||
$state-4: false, $state-5: false,
|
||||
$state-6: false, $state-7: false,
|
||||
$state-8: false, $state-9: false)
|
||||
{
|
||||
$full: compact($state-1, $state-2, $state-3, $state-4,
|
||||
$state-5, $state-6, $state-7, $state-8, $state-9);
|
||||
|
||||
-webkit-animation-play-state: $full;
|
||||
-moz-animation-play-state: $full;
|
||||
animation-play-state: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-delay ($time-1: 0,
|
||||
$time-2: false, $time-3: false,
|
||||
$time-4: false, $time-5: false,
|
||||
$time-6: false, $time-7: false,
|
||||
$time-8: false, $time-9: false)
|
||||
{
|
||||
$full: compact($time-1, $time-2, $time-3, $time-4,
|
||||
$time-5, $time-6, $time-7, $time-8, $time-9);
|
||||
|
||||
-webkit-animation-delay: $full;
|
||||
-moz-animation-delay: $full;
|
||||
animation-delay: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-fill-mode ($mode-1: none,
|
||||
// http://goo.gl/l6ckm
|
||||
// none | forwards | backwards | both
|
||||
$mode-2: false, $mode-3: false,
|
||||
$mode-4: false, $mode-5: false,
|
||||
$mode-6: false, $mode-7: false,
|
||||
$mode-8: false, $mode-9: false)
|
||||
{
|
||||
$full: compact($mode-1, $mode-2, $mode-3, $mode-4,
|
||||
$mode-5, $mode-6, $mode-7, $mode-8, $mode-9);
|
||||
|
||||
-webkit-animation-fill-mode: $full;
|
||||
-moz-animation-fill-mode: $full;
|
||||
animation-fill-mode: $full;
|
||||
}
|
||||
|
||||
|
||||
// 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);
|
||||
@mixin animation-basic ($name, $time: 0, $motion: ease) {
|
||||
$length-of-name: length($name);
|
||||
$length-of-time: length($time);
|
||||
$length-of-motion: length($motion);
|
||||
|
||||
@if $length-of-name > 1 {
|
||||
@include animation-name(zip($name));
|
||||
} @else {
|
||||
@include animation-name( $name);
|
||||
}
|
||||
|
||||
@if $length-of-time > 1 {
|
||||
@include animation-duration(zip($time));
|
||||
} @else {
|
||||
@include animation-duration( $time);
|
||||
}
|
||||
|
||||
@if $length-of-motion > 1 {
|
||||
@include animation-timing-function(zip($motion));
|
||||
} @else {
|
||||
@include animation-timing-function( $motion);
|
||||
}
|
||||
}
|
||||
|
||||
// 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;
|
||||
}
|
||||
7
sass/bourbon/css3/_appearance.scss
vendored
Normal file
7
sass/bourbon/css3/_appearance.scss
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
@mixin appearance ($value) {
|
||||
-webkit-appearance: $value;
|
||||
-moz-appearance: $value;
|
||||
-ms-appearance: $value;
|
||||
-o-appearance: $value;
|
||||
appearance: $value;
|
||||
}
|
||||
71
sass/bourbon/css3/_background-image.scss
vendored
Normal file
71
sass/bourbon/css3/_background-image.scss
vendored
Normal file
@@ -0,0 +1,71 @@
|
||||
//************************************************************************//
|
||||
// Background-image property for adding multiple background images with
|
||||
// gradients, or for stringing multiple gradients together.
|
||||
//************************************************************************//
|
||||
@import "../functions/linear-gradient";
|
||||
@import "../functions/radial-gradient";
|
||||
|
||||
@mixin background-image(
|
||||
$image-1 , $image-2: false,
|
||||
$image-3: false, $image-4: false,
|
||||
$image-5: false, $image-6: false,
|
||||
$image-7: false, $image-8: false,
|
||||
$image-9: false, $image-10: false
|
||||
) {
|
||||
$images: compact($image-1, $image-2,
|
||||
$image-3, $image-4,
|
||||
$image-5, $image-6,
|
||||
$image-7, $image-8,
|
||||
$image-9, $image-10);
|
||||
|
||||
background-image: add-prefix($images, webkit);
|
||||
background-image: add-prefix($images, moz);
|
||||
background-image: add-prefix($images, ms);
|
||||
background-image: add-prefix($images, o);
|
||||
background-image: add-prefix($images);
|
||||
}
|
||||
|
||||
|
||||
@function add-prefix($images, $vendor: false) {
|
||||
$images-prefixed: ();
|
||||
|
||||
@for $i from 1 through length($images) {
|
||||
$type: type-of(nth($images, $i)); // Get type of variable - List or String
|
||||
|
||||
// If variable is a list - Gradient
|
||||
@if $type == list {
|
||||
$gradient-type: nth(nth($images, $i), 1); // Get type of gradient (linear || radial)
|
||||
$gradient-args: nth(nth($images, $i), 2); // Get actual gradient (red, blue)
|
||||
|
||||
$gradient: render-gradients($gradient-args, $gradient-type, $vendor);
|
||||
$images-prefixed: append($images-prefixed, $gradient, comma);
|
||||
}
|
||||
|
||||
// If variable is a string - Image
|
||||
@else if $type == string {
|
||||
$images-prefixed: join($images-prefixed, nth($images, $i), comma);
|
||||
}
|
||||
}
|
||||
@return $images-prefixed;
|
||||
}
|
||||
|
||||
|
||||
@function render-gradients($gradients, $gradient-type, $vendor: false) {
|
||||
$vendor-gradients: false;
|
||||
@if $vendor {
|
||||
$vendor-gradients: -#{$vendor}-#{$gradient-type}-gradient($gradients);
|
||||
}
|
||||
|
||||
@else if $vendor == false {
|
||||
$vendor-gradients: "#{$gradient-type}-gradient(#{$gradients})";
|
||||
$vendor-gradients: unquote($vendor-gradients);
|
||||
}
|
||||
@return $vendor-gradients;
|
||||
}
|
||||
|
||||
//Examples:
|
||||
//@include background-image(linear-gradient(top, orange, red));
|
||||
//@include background-image(radial-gradient(50% 50%, cover circle, orange, red));
|
||||
//@include background-image(url("/images/a.png"), linear-gradient(orange, red));
|
||||
//@include background-image(url("image.png"), linear-gradient(orange, red), url("image.png"));
|
||||
//@include background-image(linear-gradient(hsla(0, 100%, 100%, 0.25) 0%, hsla(0, 100%, 100%, 0.08) 50%, transparent 50%), linear-gradient(orange, red);
|
||||
15
sass/bourbon/css3/_background-size.scss
vendored
Normal file
15
sass/bourbon/css3/_background-size.scss
vendored
Normal file
@@ -0,0 +1,15 @@
|
||||
@mixin background-size ($length-1,
|
||||
$length-2: false, $length-3: false,
|
||||
$length-4: false, $length-5: false,
|
||||
$length-6: false, $length-7: false,
|
||||
$length-8: false, $length-9: false)
|
||||
{
|
||||
$full: compact($length-1, $length-2, $length-3, $length-4,
|
||||
$length-5, $length-6, $length-7, $length-8, $length-9);
|
||||
|
||||
-webkit-background-size: $full;
|
||||
-moz-background-size: $full;
|
||||
-ms-background-size: $full;
|
||||
-o-background-size: $full;
|
||||
background-size: $full;
|
||||
}
|
||||
7
sass/bourbon/css3/_border-image.scss
vendored
Normal file
7
sass/bourbon/css3/_border-image.scss
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
@mixin border-image ($image) {
|
||||
-webkit-border-image: $image;
|
||||
-moz-border-image: $image;
|
||||
-ms-border-image: $image;
|
||||
-o-border-image: $image;
|
||||
border-image: $image;
|
||||
}
|
||||
59
sass/bourbon/css3/_border-radius.scss
vendored
Normal file
59
sass/bourbon/css3/_border-radius.scss
vendored
Normal file
@@ -0,0 +1,59 @@
|
||||
@mixin border-radius ($radii) {
|
||||
-webkit-border-radius: $radii;
|
||||
-moz-border-radius: $radii;
|
||||
-ms-border-radius: $radii;
|
||||
-o-border-radius: $radii;
|
||||
border-radius: $radii;
|
||||
}
|
||||
|
||||
@mixin border-top-left-radius($radii) {
|
||||
-webkit-border-top-left-radius: $radii;
|
||||
-moz-border-top-left-radius: $radii;
|
||||
-ms-border-top-left-radius: $radii;
|
||||
-o-border-top-left-radius: $radii;
|
||||
border-top-left-radius: $radii;
|
||||
}
|
||||
|
||||
@mixin border-top-right-radius($radii) {
|
||||
-webkit-border-top-right-radius: $radii;
|
||||
-moz-border-top-right-radius: $radii;
|
||||
-ms-border-top-right-radius: $radii;
|
||||
-o-border-top-right-radius: $radii;
|
||||
border-top-right-radius: $radii;
|
||||
}
|
||||
|
||||
@mixin border-bottom-left-radius($radii) {
|
||||
-webkit-border-bottom-left-radius: $radii;
|
||||
-moz-border-bottom-left-radius: $radii;
|
||||
-ms-border-bottom-left-radius: $radii;
|
||||
-o-border-bottom-left-radius: $radii;
|
||||
border-bottom-left-radius: $radii;
|
||||
}
|
||||
|
||||
@mixin border-bottom-right-radius($radii) {
|
||||
-webkit-border-bottom-right-radius: $radii;
|
||||
-moz-border-bottom-right-radius: $radii;
|
||||
-ms-border-bottom-right-radius: $radii;
|
||||
-o-border-bottom-right-radius: $radii;
|
||||
border-bottom-right-radius: $radii;
|
||||
}
|
||||
|
||||
@mixin border-top-radius($radii) {
|
||||
@include border-top-left-radius($radii);
|
||||
@include border-top-right-radius($radii);
|
||||
}
|
||||
|
||||
@mixin border-right-radius($radii) {
|
||||
@include border-top-right-radius($radii);
|
||||
@include border-bottom-right-radius($radii);
|
||||
}
|
||||
|
||||
@mixin border-bottom-radius($radii) {
|
||||
@include border-bottom-left-radius($radii);
|
||||
@include border-bottom-right-radius($radii);
|
||||
}
|
||||
|
||||
@mixin border-left-radius($radii) {
|
||||
@include border-top-left-radius($radii);
|
||||
@include border-bottom-left-radius($radii);
|
||||
}
|
||||
16
sass/bourbon/css3/_box-shadow.scss
vendored
Normal file
16
sass/bourbon/css3/_box-shadow.scss
vendored
Normal file
@@ -0,0 +1,16 @@
|
||||
// Box-Shadow Mixin Requires Sass v3.1.1+
|
||||
@mixin box-shadow ($shadow-1,
|
||||
$shadow-2: false, $shadow-3: false,
|
||||
$shadow-4: false, $shadow-5: false,
|
||||
$shadow-6: false, $shadow-7: false,
|
||||
$shadow-8: false, $shadow-9: false)
|
||||
{
|
||||
$full: compact($shadow-1, $shadow-2, $shadow-3, $shadow-4,
|
||||
$shadow-5, $shadow-6, $shadow-7, $shadow-8, $shadow-9);
|
||||
|
||||
-webkit-box-shadow: $full;
|
||||
-moz-box-shadow: $full;
|
||||
-ms-box-shadow: $full;
|
||||
-o-box-shadow: $full;
|
||||
box-shadow: $full;
|
||||
}
|
||||
8
sass/bourbon/css3/_box-sizing.scss
vendored
Normal file
8
sass/bourbon/css3/_box-sizing.scss
vendored
Normal file
@@ -0,0 +1,8 @@
|
||||
@mixin box-sizing ($box) {
|
||||
// content-box | border-box | inherit
|
||||
-webkit-box-sizing: $box;
|
||||
-moz-box-sizing: $box;
|
||||
-ms-box-sizing: $box;
|
||||
-o-box-sizing: $box;
|
||||
box-sizing: $box;
|
||||
}
|
||||
67
sass/bourbon/css3/_columns.scss
vendored
Normal file
67
sass/bourbon/css3/_columns.scss
vendored
Normal file
@@ -0,0 +1,67 @@
|
||||
@mixin columns($arg: auto) {
|
||||
// <column-count> || <column-width>
|
||||
-webkit-columns: $arg;
|
||||
-moz-columns: $arg;
|
||||
columns: $arg;
|
||||
}
|
||||
|
||||
@mixin column-count($int: auto) {
|
||||
// auto || integer
|
||||
-webkit-column-count: $int;
|
||||
-moz-column-count: $int;
|
||||
column-count: $int;
|
||||
}
|
||||
|
||||
@mixin column-gap($length: normal) {
|
||||
// normal || length
|
||||
-webkit-column-gap: $length;
|
||||
-moz-column-gap: $length;
|
||||
column-gap: $length;
|
||||
}
|
||||
|
||||
@mixin column-fill($arg: auto) {
|
||||
// auto || length
|
||||
-webkit-columns-fill: $arg;
|
||||
-moz-columns-fill: $arg;
|
||||
columns-fill: $arg;
|
||||
}
|
||||
|
||||
@mixin column-rule($arg) {
|
||||
// <border-width> || <border-style> || <color>
|
||||
-webkit-column-rule: $arg;
|
||||
-moz-column-rule: $arg;
|
||||
column-rule: $arg;
|
||||
}
|
||||
|
||||
@mixin column-rule-color($color) {
|
||||
-webkit-column-rule-color: $color;
|
||||
-moz-column-rule-color: $color;
|
||||
column-rule-color: $color;
|
||||
}
|
||||
|
||||
@mixin column-rule-style($style: none) {
|
||||
// none | hidden | dashed | dotted | double | groove | inset | inset | outset | ridge | solid
|
||||
-webkit-column-rule-style: $style;
|
||||
-moz-column-rule-style: $style;
|
||||
column-rule-style: $style;
|
||||
}
|
||||
|
||||
@mixin column-rule-width ($width: none) {
|
||||
-webkit-column-rule-width: $width;
|
||||
-moz-column-rule-width: $width;
|
||||
column-rule-width: $width;
|
||||
}
|
||||
|
||||
@mixin column-span($arg: none) {
|
||||
// none || all
|
||||
-webkit-column-span: $arg;
|
||||
-moz-column-span: $arg;
|
||||
column-span: $arg;
|
||||
}
|
||||
|
||||
@mixin column-width($length: auto) {
|
||||
// auto || length
|
||||
-webkit-column-width: $length;
|
||||
-moz-column-width: $length;
|
||||
column-width: $length;
|
||||
}
|
||||
67
sass/bourbon/css3/_flex-box.scss
vendored
Normal file
67
sass/bourbon/css3/_flex-box.scss
vendored
Normal file
@@ -0,0 +1,67 @@
|
||||
// CSS3 Flexible Box Model and property defaults
|
||||
|
||||
// Custom shorthand notation for flexbox
|
||||
@mixin box($orient: inline-axis, $pack: start, $align: stretch) {
|
||||
@include display-box;
|
||||
@include box-orient($orient);
|
||||
@include box-pack($pack);
|
||||
@include box-align($align);
|
||||
}
|
||||
|
||||
@mixin display-box {
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: box;
|
||||
}
|
||||
|
||||
@mixin box-orient($orient: inline-axis) {
|
||||
// horizontal|vertical|inline-axis|block-axis|inherit
|
||||
-webkit-box-orient: $orient;
|
||||
-moz-box-orient: $orient;
|
||||
box-orient: $orient;
|
||||
}
|
||||
|
||||
@mixin box-pack($pack: start) {
|
||||
// start|end|center|justify
|
||||
-webkit-box-pack: $pack;
|
||||
-moz-box-pack: $pack;
|
||||
box-pack: $pack;
|
||||
}
|
||||
|
||||
@mixin box-align($align: stretch) {
|
||||
// start|end|center|baseline|stretch
|
||||
-webkit-box-align: $align;
|
||||
-moz-box-align: $align;
|
||||
box-align: $align;
|
||||
}
|
||||
|
||||
@mixin box-direction($direction: normal) {
|
||||
// normal|reverse|inherit
|
||||
-webkit-box-direction: $direction;
|
||||
-moz-box-direction: $direction;
|
||||
box-direction: $direction;
|
||||
}
|
||||
@mixin box-lines($lines: single) {
|
||||
// single|multiple
|
||||
-webkit-box-lines: $lines;
|
||||
-moz-box-lines: $lines;
|
||||
box-lines: $lines;
|
||||
}
|
||||
|
||||
@mixin box-ordinal-group($integer: 1) {
|
||||
-webkit-box-ordinal-group: $integer;
|
||||
-moz-box-ordinal-group: $integer;
|
||||
box-ordinal-group: $integer;
|
||||
}
|
||||
|
||||
@mixin box-flex($value: 0.0) {
|
||||
-webkit-box-flex: $value;
|
||||
-moz-box-flex: $value;
|
||||
box-flex: $value;
|
||||
}
|
||||
|
||||
@mixin box-flex-group($integer: 1) {
|
||||
-webkit-box-flex-group: $integer;
|
||||
-moz-box-flex-group: $integer;
|
||||
box-flex-group: $integer;
|
||||
}
|
||||
10
sass/bourbon/css3/_inline-block.scss
vendored
Normal file
10
sass/bourbon/css3/_inline-block.scss
vendored
Normal file
@@ -0,0 +1,10 @@
|
||||
// Legacy support for inline-block in IE7 (maybe IE6)
|
||||
@mixin inline-block {
|
||||
display: -moz-inline-box;
|
||||
-moz-box-orient: vertical;
|
||||
display: inline-block;
|
||||
vertical-align: baseline;
|
||||
zoom: 1;
|
||||
*display: inline;
|
||||
*vertical-align: auto;
|
||||
}
|
||||
31
sass/bourbon/css3/_linear-gradient.scss
vendored
Normal file
31
sass/bourbon/css3/_linear-gradient.scss
vendored
Normal file
@@ -0,0 +1,31 @@
|
||||
@mixin linear-gradient($pos, $G1, $G2: false,
|
||||
$G3: false, $G4: false,
|
||||
$G5: false, $G6: false,
|
||||
$G7: false, $G8: false,
|
||||
$G9: false, $G10: false) {
|
||||
// Detect what type of value exists in $pos
|
||||
$pos-type: type-of(nth($pos, 1));
|
||||
|
||||
// If $pos is missing from mixin, reassign vars and add default position
|
||||
@if ($pos-type == color) or (nth($pos, 1) == "transparent") {
|
||||
$G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5;
|
||||
$G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos;
|
||||
$pos: top; // Default position
|
||||
}
|
||||
|
||||
$full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
||||
|
||||
background-color: nth($G1, 1);
|
||||
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);
|
||||
background-image: -ms-linear-gradient($pos, $full);
|
||||
background-image: -o-linear-gradient($pos, $full);
|
||||
background-image: unquote("linear-gradient(#{$pos}, #{$full})");
|
||||
}
|
||||
|
||||
|
||||
// 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(top, #1e5799 0%, #2989d8 50%);
|
||||
// @include linear-gradient(50deg, rgba(10, 10, 10, 0.5) 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
|
||||
22
sass/bourbon/css3/_radial-gradient.scss
vendored
Normal file
22
sass/bourbon/css3/_radial-gradient.scss
vendored
Normal file
@@ -0,0 +1,22 @@
|
||||
// Requires Sass 3.1+
|
||||
@mixin radial-gradient($pos, $shape-size,
|
||||
$G1, $G2,
|
||||
$G3: false, $G4: false,
|
||||
$G5: false, $G6: false,
|
||||
$G7: false, $G8: false,
|
||||
$G9: false, $G10: false) {
|
||||
|
||||
$full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
||||
|
||||
background-color: nth($G1, 1);
|
||||
background-image: deprecated-webkit-gradient(radial, $full); // Safari <= 5.0
|
||||
background-image: -webkit-radial-gradient($pos, $shape-size, $full);
|
||||
background-image: -moz-radial-gradient($pos, $shape-size, $full);
|
||||
background-image: -ms-radial-gradient($pos, $shape-size, $full);
|
||||
background-image: -o-radial-gradient($pos, $shape-size, $full);
|
||||
background-image: unquote("radial-gradient(#{$pos}, #{$shape-size}, #{$full})");
|
||||
}
|
||||
|
||||
// Usage: Gradient position and shape-size are required. Color stops are optional.
|
||||
// @include radial-gradient(50% 50%, circle cover, #1e5799, #efefef);
|
||||
// @include radial-gradient(50% 50%, circle cover, #eee 10%, #1e5799 30%, #efefef);
|
||||
19
sass/bourbon/css3/_transform.scss
vendored
Normal file
19
sass/bourbon/css3/_transform.scss
vendored
Normal file
@@ -0,0 +1,19 @@
|
||||
@mixin transform($property: none) {
|
||||
// none | <transform-function>
|
||||
-webkit-transform: $property;
|
||||
-moz-transform: $property;
|
||||
-ms-transform: $property;
|
||||
-o-transform: $property;
|
||||
transform: $property;
|
||||
}
|
||||
|
||||
@mixin transform-origin($axes: 50%) {
|
||||
// x-axis - left | center | right | length | %
|
||||
// y-axis - top | center | bottom | length | %
|
||||
// z-axis - length
|
||||
-webkit-transform-origin: $axes;
|
||||
-moz-transform-origin: $axes;
|
||||
-ms-transform-origin: $axes;
|
||||
-o-transform-origin: $axes;
|
||||
transform-origin: $axes;
|
||||
}
|
||||
104
sass/bourbon/css3/_transition.scss
vendored
Normal file
104
sass/bourbon/css3/_transition.scss
vendored
Normal file
@@ -0,0 +1,104 @@
|
||||
// Shorthand mixin. Supports multiple parentheses-deliminated values for each variable.
|
||||
// Example: @include transition (all, 2.0s, ease-in-out);
|
||||
// @include transition ((opacity, width), (1.0s, 2.0s), ease-in, (0, 2s));
|
||||
// @include transition ($property:(opacity, width), $delay: (1.5s, 2.5s));
|
||||
|
||||
@mixin transition ($property: all, $duration: 0.15s, $timing-function: ease-out, $delay: 0) {
|
||||
|
||||
// Detect # of args passed into each variable
|
||||
$length-of-property: length($property);
|
||||
$length-of-duration: length($duration);
|
||||
$length-of-timing-function: length($timing-function);
|
||||
$length-of-delay: length($delay);
|
||||
|
||||
@if $length-of-property > 1 {
|
||||
@include transition-property(zip($property)); }
|
||||
@else {
|
||||
@include transition-property( $property);
|
||||
}
|
||||
|
||||
@if $length-of-duration > 1 {
|
||||
@include transition-duration(zip($duration)); }
|
||||
@else {
|
||||
@include transition-duration( $duration);
|
||||
}
|
||||
|
||||
@if $length-of-timing-function > 1 {
|
||||
@include transition-timing-function(zip($timing-function)); }
|
||||
@else {
|
||||
@include transition-timing-function( $timing-function);
|
||||
}
|
||||
|
||||
@if $length-of-delay > 1 {
|
||||
@include transition-delay(zip($delay)); }
|
||||
@else {
|
||||
@include transition-delay( $delay);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@mixin transition-property ($prop-1: all,
|
||||
$prop-2: false, $prop-3: false,
|
||||
$prop-4: false, $prop-5: false,
|
||||
$prop-6: false, $prop-7: false,
|
||||
$prop-8: false, $prop-9: false)
|
||||
{
|
||||
$full: compact($prop-1, $prop-2, $prop-3, $prop-4, $prop-5,
|
||||
$prop-6, $prop-7, $prop-8, $prop-9);
|
||||
|
||||
-webkit-transition-property: $full;
|
||||
-moz-transition-property: $full;
|
||||
-ms-transition-property: $full;
|
||||
-o-transition-property: $full;
|
||||
transition-property: $full;
|
||||
}
|
||||
|
||||
@mixin transition-duration ($time-1: 0,
|
||||
$time-2: false, $time-3: false,
|
||||
$time-4: false, $time-5: false,
|
||||
$time-6: false, $time-7: false,
|
||||
$time-8: false, $time-9: false)
|
||||
{
|
||||
$full: compact($time-1, $time-2, $time-3, $time-4, $time-5,
|
||||
$time-6, $time-7, $time-8, $time-9);
|
||||
|
||||
-webkit-transition-duration: $full;
|
||||
-moz-transition-duration: $full;
|
||||
-ms-transition-duration: $full;
|
||||
-o-transition-duration: $full;
|
||||
transition-duration: $full;
|
||||
}
|
||||
|
||||
@mixin transition-timing-function ($motion-1: ease,
|
||||
$motion-2: false, $motion-3: false,
|
||||
$motion-4: false, $motion-5: false,
|
||||
$motion-6: false, $motion-7: false,
|
||||
$motion-8: false, $motion-9: false)
|
||||
{
|
||||
$full: compact($motion-1, $motion-2, $motion-3, $motion-4, $motion-5,
|
||||
$motion-6, $motion-7, $motion-8, $motion-9);
|
||||
|
||||
// ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier()
|
||||
-webkit-transition-timing-function: $full;
|
||||
-moz-transition-timing-function: $full;
|
||||
-ms-transition-timing-function: $full;
|
||||
-o-transition-timing-function: $full;
|
||||
transition-timing-function: $full;
|
||||
}
|
||||
|
||||
@mixin transition-delay ($time-1: 0,
|
||||
$time-2: false, $time-3: false,
|
||||
$time-4: false, $time-5: false,
|
||||
$time-6: false, $time-7: false,
|
||||
$time-8: false, $time-9: false)
|
||||
{
|
||||
$full: compact($time-1, $time-2, $time-3, $time-4, $time-5,
|
||||
$time-6, $time-7, $time-8, $time-9);
|
||||
|
||||
-webkit-transition-delay: $full;
|
||||
-moz-transition-delay: $full;
|
||||
-ms-transition-delay: $full;
|
||||
-o-transition-delay: $full;
|
||||
transition-delay: $full;
|
||||
}
|
||||
|
||||
36
sass/bourbon/functions/_deprecated-webkit-gradient.scss
vendored
Normal file
36
sass/bourbon/functions/_deprecated-webkit-gradient.scss
vendored
Normal file
@@ -0,0 +1,36 @@
|
||||
// Render Deprecated Webkit Gradient - Linear || Radial
|
||||
//************************************************************************//
|
||||
@function deprecated-webkit-gradient($type, $full) {
|
||||
$gradient-list: ();
|
||||
$gradient: false;
|
||||
$full-length: length($full);
|
||||
$percentage: false;
|
||||
$gradient-type: $type;
|
||||
|
||||
@for $i from 1 through $full-length {
|
||||
$gradient: nth($full, $i);
|
||||
|
||||
@if length($gradient) == 2 {
|
||||
$color-stop: color-stop(nth($gradient, 2), nth($gradient, 1));
|
||||
$gradient-list: join($gradient-list, $color-stop, comma);
|
||||
}
|
||||
@else {
|
||||
@if $i == $full-length {
|
||||
$percentage: 100%;
|
||||
}
|
||||
@else {
|
||||
$percentage: ($i - 1) * (100 / ($full-length - 1)) + "%";
|
||||
}
|
||||
$color-stop: color-stop(unquote($percentage), $gradient);
|
||||
$gradient-list: join($gradient-list, $color-stop, comma);
|
||||
}
|
||||
}
|
||||
|
||||
@if $type == radial {
|
||||
$gradient: -webkit-gradient(radial, center center, 0, center center, 460, $gradient-list);
|
||||
}
|
||||
@else if $type == linear {
|
||||
$gradient: -webkit-gradient(linear, left top, left bottom, $gradient-list);
|
||||
}
|
||||
@return $gradient;
|
||||
}
|
||||
31
sass/bourbon/functions/_golden-ratio.scss
vendored
Normal file
31
sass/bourbon/functions/_golden-ratio.scss
vendored
Normal file
@@ -0,0 +1,31 @@
|
||||
@function golden-ratio($value, $increment) {
|
||||
@if $increment > 0 {
|
||||
@for $i from 1 through $increment {
|
||||
$value: ($value * 1.618);
|
||||
}
|
||||
}
|
||||
|
||||
@if $increment < 0 {
|
||||
$increment: abs($increment);
|
||||
@for $i from 1 through $increment {
|
||||
$value: ($value / 1.618);
|
||||
}
|
||||
}
|
||||
|
||||
@return $value;
|
||||
}
|
||||
|
||||
// div {
|
||||
// Increment Up GR with positive value
|
||||
// font-size: golden-ratio(14px, 1); // returns: 22.652px
|
||||
//
|
||||
// Increment Down GR with negative value
|
||||
// font-size: golden-ratio(14px, -1); // 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
|
||||
// }
|
||||
//
|
||||
// modularscale.com
|
||||
// goldenratiocalculator.com
|
||||
13
sass/bourbon/functions/_grid-width.scss
vendored
Normal file
13
sass/bourbon/functions/_grid-width.scss
vendored
Normal file
@@ -0,0 +1,13 @@
|
||||
@function grid-width($n) {
|
||||
@return $n * $gw-column + ($n - 1) * $gw-gutter;
|
||||
}
|
||||
|
||||
// The $gw-column and $gw-gutter variables must be defined in your base stylesheet to properly use the grid-width function.
|
||||
//
|
||||
// $gw-column: 100px; // Column Width
|
||||
// $gw-gutter: 40px; // Gutter Width
|
||||
//
|
||||
// div {
|
||||
// width: grid-width(4); // returns 520px;
|
||||
// margin-left: $gw-gutter; // returns 40px;
|
||||
// }
|
||||
23
sass/bourbon/functions/_linear-gradient.scss
vendored
Normal file
23
sass/bourbon/functions/_linear-gradient.scss
vendored
Normal file
@@ -0,0 +1,23 @@
|
||||
@function linear-gradient($pos: top, $G1: false, $G2: false,
|
||||
$G3: false, $G4: false,
|
||||
$G5: false, $G6: false,
|
||||
$G7: false, $G8: false,
|
||||
$G9: false, $G10: false) {
|
||||
|
||||
// Detect what type of value exists in $pos
|
||||
$pos-type: type-of(nth($pos, 1));
|
||||
|
||||
// If $pos is missing from mixin, reassign vars and add default position
|
||||
@if ($pos-type == color) or (nth($pos, 1) == "transparent") {
|
||||
$G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5;
|
||||
$G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos;
|
||||
$pos: top; // Default position
|
||||
}
|
||||
|
||||
$type: linear;
|
||||
$gradient: compact($pos, $G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
||||
$type-gradient: append($type, $gradient, comma);
|
||||
|
||||
@return $type-gradient;
|
||||
}
|
||||
|
||||
15
sass/bourbon/functions/_radial-gradient.scss
vendored
Normal file
15
sass/bourbon/functions/_radial-gradient.scss
vendored
Normal file
@@ -0,0 +1,15 @@
|
||||
// This function is required and used by the background-image mixin.
|
||||
@function radial-gradient($pos, $shape-size,
|
||||
$G1, $G2,
|
||||
$G3: false, $G4: false,
|
||||
$G5: false, $G6: false,
|
||||
$G7: false, $G8: false,
|
||||
$G9: false, $G10: false) {
|
||||
|
||||
$type: radial;
|
||||
$gradient: compact($pos, $shape-size, $G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
||||
$type-gradient: append($type, $gradient, comma);
|
||||
|
||||
@return $type-gradient;
|
||||
}
|
||||
|
||||
9
sass/bourbon/functions/_tint-shade.scss
vendored
Normal file
9
sass/bourbon/functions/_tint-shade.scss
vendored
Normal file
@@ -0,0 +1,9 @@
|
||||
// Add percentage of white to a color
|
||||
@function tint($color, $percent){
|
||||
@return mix(white, $color, $percent);
|
||||
}
|
||||
|
||||
// Add percentage of black to a color
|
||||
@function shade($color, $percent){
|
||||
@return mix(black, $color, $percent);
|
||||
}
|
||||
17
sass/bourbon/lib/bourbon.rb
Normal file
17
sass/bourbon/lib/bourbon.rb
Normal file
@@ -0,0 +1,17 @@
|
||||
module Bourbon
|
||||
if defined?(Rails)
|
||||
class Engine < ::Rails::Engine
|
||||
require 'bourbon/engine'
|
||||
end
|
||||
|
||||
module Rails
|
||||
class Railtie < ::Rails::Railtie
|
||||
rake_tasks do
|
||||
load "tasks/install.rake"
|
||||
end
|
||||
end
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
require File.join(File.dirname(__FILE__), "/bourbon/sass_extensions")
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user