From 70e273db20ecedaf72b29d32a72269f6e4d3950a Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Thu, 9 Feb 2012 15:06:08 -0500 Subject: [PATCH 01/46] Added some more style for course info and profile pages --- sass/_base-extends.scss | 7 ++++ sass/_info.scss | 75 ++++++++++++++++++++++++++++++++++------- sass/_profile.scss | 7 +++- 3 files changed, 76 insertions(+), 13 deletions(-) diff --git a/sass/_base-extends.scss b/sass/_base-extends.scss index c8c5e4b687..93ef00dd3f 100644 --- a/sass/_base-extends.scss +++ b/sass/_base-extends.scss @@ -19,6 +19,13 @@ } } +h1.top-header { + margin: (-(lh())) (-(lh())) lh(); + padding: lh(); + background: #f3f3f3; + border-bottom: 1px solid #e3e3e3; +} + .button { @include box-shadow(inset 0 1px 0 lighten(#888, 10%), 0 0 3px #ccc); @include linear-gradient(lighten(#888, 5%), darken(#888, 5%)); diff --git a/sass/_info.scss b/sass/_info.scss index 687608d0a2..9f0762cd59 100644 --- a/sass/_info.scss +++ b/sass/_info.scss @@ -3,37 +3,88 @@ div.info-wrapper { section.updates { @extend .content; - } - section.handouts { - @extend .sidebar; - @include border-radius(0px 4px 0px 4px); - border-right: 0; - border-left: 1px solid #d3d3d3; + > h1 { + @extend .top-header; + } - h1 { - padding: 0 lh(); + > p { + margin-bottom: lh(); } ol { list-style: none; li { + padding-bottom: lh(.5); + margin-bottom: lh(.5); + @extend .clearfix; + border-bottom: 1px solid #e3e3e3; + h2 { - padding: 0 lh(); + float: left; + width: flex-grid(2, 9); + margin: 0 flex-gutter() 0 0; + } + + p { + float: left; + width: flex-grid(7, 9); + margin-bottom: 0; + } + } + } + } + + section.handouts { + @extend .sidebar; + @include border-radius(0 4px 4px 0); + border-right: 0; + border-left: 1px solid #d3d3d3; + + h1 { + padding: 0 lh(); + font-size: 18px; + } + + ol { + list-style: none; + + li { + @include box-shadow(0 1px 0 #eee); + border-bottom: 1px solid #d3d3d3; + @extend .clearfix; + + p { + padding: 7px lh(); + margin: 0; + text-transform: none; + letter-spacing: 0; + font-size: $body-font-size; + + &:hover { + background: #efefef; + } + + a { + display: inline; + padding: 0; + + &:hover { + text-decoration: underline; + background: none; + } + } } a { - @include box-shadow(0 1px 0 #eee); @include transition(); - border-bottom: 1px solid #d3d3d3; color: lighten($text-color, 10%); display: block; padding: 7px lh(); text-decoration: none; &:hover { - @include box-shadow(0 1px 0 #fff); background: #efefef; } } diff --git a/sass/_profile.scss b/sass/_profile.scss index b383c61a85..68a93cf73f 100644 --- a/sass/_profile.scss +++ b/sass/_profile.scss @@ -9,7 +9,8 @@ div.profile-wrapper { border-right: 0; h1 { - padding: lh(); + padding:0 lh(); + font-size: 18px; } ul { @@ -52,6 +53,10 @@ div.profile-wrapper { section.course-info { @extend .content; + > h1 { + @extend .top-header; + } + ol { list-style: none; From e4b1e0588f2acf4ab23b1a432f978ccfb5e062f1 Mon Sep 17 00:00:00 2001 From: Ernie Park Date: Thu, 9 Feb 2012 15:06:32 -0500 Subject: [PATCH 02/46] enable space bar to pause video --HG-- branch : templates-ernie-video-spacebar --- video_init.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/video_init.js b/video_init.js index 42dddad573..e10d85095f 100644 --- a/video_init.js +++ b/video_init.js @@ -70,3 +70,11 @@ $("#video_control").click(function(){ $(this).removeClass().addClass("play"); } }); +// space bar to pause video +$(".video-wrapper").keyup(function(e){ + active = document.activeElement; + if (e.which == 32) { + e.preventDefault(); + $("#video_control").click(); + } +}); From 4e2ac787e0b64c4865aadfca0e9eaef05906b55f Mon Sep 17 00:00:00 2001 From: Bridger Maxwell Date: Thu, 9 Feb 2012 15:18:38 -0500 Subject: [PATCH 03/46] Changed instructions for wikipath extension --- simplewiki_instructions.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/simplewiki_instructions.html b/simplewiki_instructions.html index a1a7273692..8b579feda2 100644 --- a/simplewiki_instructions.html +++ b/simplewiki_instructions.html @@ -5,7 +5,7 @@

circuit:basic

$LaTeX Math Expression$

To create a new wiki article, create a link to it. Clicking the link gives you the creation page. -

[Article Name](/wiki/view/ArticleName)

+

[Article Name](wiki:ArticleName)

Other useful examples:

[Link](http://google.com)

Huge Header From b605dfc3b500795ca42e6af92fd0a0a12c434ada Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Thu, 9 Feb 2012 15:51:04 -0500 Subject: [PATCH 04/46] Flashes error message for all forms on sign up --- index.html | 2 +- marketing.html | 3 +-- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index b1ee886b07..8a8820cc7d 100644 --- a/index.html +++ b/index.html @@ -102,7 +102,7 @@ $(function() { if(json.success) { $('#enroll').html(json.value); } else { - $('#enroll_error').html(json.value); + $('#enroll_error').html(json.value).stop().css("background-color", "#933").animate({ backgroundColor: "#333"}, 2000); } } ); diff --git a/marketing.html b/marketing.html index e941ab38fe..84e5b50666 100644 --- a/marketing.html +++ b/marketing.html @@ -100,7 +100,6 @@ function postJSON(url, data, callback) { % if settings.COURSEWARE_ENABLED:

<%include file="login.html" />
-
<%include file="create_account.html" />
% endif
<%include file="password_reset_form.html" />
@@ -142,7 +141,7 @@ $(document).ready(function(){ if (json.success) { $('#pwd_reset').html(json.value); } else { - $('#pwd_error').html(json.error); + $('#pwd_error').html(json.error).stop().css("background-color", "#933").animate({ backgroundColor: "#333"}, 2000); } } ); From 254e806ac52899e3d223ced7c331cb025761584e Mon Sep 17 00:00:00 2001 From: Reda Lemeden Date: Thu, 9 Feb 2012 15:56:21 -0500 Subject: [PATCH 05/46] Fixed the footer and the sidebar --- sass/_discussion-answers.scss | 7 ++++++- sass/_discussion.scss | 27 ++++++++++++++------------- 2 files changed, 20 insertions(+), 14 deletions(-) diff --git a/sass/_discussion-answers.scss b/sass/_discussion-answers.scss index 1743b236a3..17e1df160f 100644 --- a/sass/_discussion-answers.scss +++ b/sass/_discussion-answers.scss @@ -44,7 +44,11 @@ div.answer-block { } div.answered-by-owner { - color: darken($mit-red, 20%); + color: $mit-red; + + div.comments-container { + color: #555; + } } } @@ -65,6 +69,7 @@ div.answer-actions { } a { text-decoration: none; + cursor: pointer; } a.question-edit, a.permant-link { color: #999; diff --git a/sass/_discussion.scss b/sass/_discussion.scss index 844b1b307f..58250f9b73 100644 --- a/sass/_discussion.scss +++ b/sass/_discussion.scss @@ -123,6 +123,7 @@ body.askbot { aside { @extend .sidebar; @include box-shadow(inset 1px 0 0 #f6f6f6); + @include border-radius(0 4px 4px 0); border-left: 1px solid #d3d3d3; border-right: 1px solid #f6f6f6; padding: $gw-gutter; @@ -148,18 +149,18 @@ body.askbot { } } - footer { - margin: 0 auto; - padding: 0; + // footer { + // margin: 0 auto; + // padding: 0; - div.footer-wrapper { - @extend .clearfix; - @extend .wrapper; - @include box-shadow(0 1px 0 #fff); - @include box-sizing(border-box); - background-color: #000; - border-top: 0; - padding: $gw-gutter/2; - } - } + // div.footer-wrapper { + // @extend .clearfix; + // @extend .wrapper; + // @include box-shadow(0 1px 0 #fff); + // @include box-sizing(border-box); + // background-color: #000; + // border-top: 0; + // padding: $gw-gutter/2; + // } + // } } From a3dbdb95124026c8dd20e8d60bc0bb6284189da5 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Thu, 9 Feb 2012 18:03:06 -0500 Subject: [PATCH 06/46] Added anats static pages --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 8a8820cc7d..1e37891a58 100644 --- a/index.html +++ b/index.html @@ -1,4 +1,4 @@ -<%inherit file="marketing.html" /> +<%inherit file="marketing.html" /> <%block name="header_text">
From 372a9875775026be7223a142506327ae0fb62a1b Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Thu, 9 Feb 2012 18:04:56 -0500 Subject: [PATCH 07/46] Added anats static pages --- 6002x-faq.html | 167 +++++++++++++++++++++++++++++++++++++++ 6002x-press-release.html | 83 +++++++++++++++++++ mitx-overview.html | 37 +++++++++ 3 files changed, 287 insertions(+) create mode 100644 6002x-faq.html create mode 100644 6002x-press-release.html create mode 100644 mitx-overview.html diff --git a/6002x-faq.html b/6002x-faq.html new file mode 100644 index 0000000000..106344127f --- /dev/null +++ b/6002x-faq.html @@ -0,0 +1,167 @@ +<%inherit file="marketing.html" /> + +

+More about 6.002x +

+ +

Answering common questions about the first course on MITx, the Institute’s online-learning initiative.

+ +

+This set of questions and answers accompanies MIT’s February 13, 2012, announcement regarding MITx’s prototype course — 6.002x: Circuits and Electronics. +

+ +

+What is MITx?
MIT seeks through the development of MITx to improve education both on the MIT campus and around the world. +

+ +

On campus, MITx will be coupled with an Institute-wide research initiative on online teaching and learning. The online learning tools that MITx develops will benefit the educational experience of residential students by supplementing and reinforcing the classroom and laboratory experiences.

+ +

+Beyond the MIT campus, MITx will endeavor to break down barriers to education in two ways. First, it will offer the online teaching of MIT courses to people around the world and the opportunity for able learners to gain certification of mastery of MIT material. Second, it will make freely available to educational institutions everywhere the open-source software infrastructure on which MITx courses are based. +

+ +

+Since it launched OpenCourseWare 10 years ago, MIT has been committed to using technology to improve and greatly widen access to education. The launch of MITx represents a next step forward in that effort. +

+ +

+What is 6.002x, and how is it different from the on-campus version of 6.002? +

+ +

+At MIT, each course is assigned a number. All courses in the Department of Electrical Engineering and Computer Science (EECS) start with the number 6, and 6.002 (also known as Circuits and Electronics) is one of the introductory courses for EECS undergraduates. MITx’s 6.002x is modeled on the on-campus version of 6.002. +

+ +

+ The course introduces engineering in the context of the lumped circuit abstraction. Topics covered include: resistive elements and networks; independent and dependent sources; switches and MOS transistors; digital abstraction; amplifiers; energy storage elements; dynamics of first- and second-order networks; design in the time and frequency domains; and analog and digital circuits and applications. +

+ +

+6.002x is built on the content created collaboratively by MIT professors Anant Agarwal and Jeffrey H. Lang for 6.002. +

+ +

+How do I enroll in 6.002x? +

+

+To enroll, visit http://mitx.mit.edu and sign up. +

+ +

+When will the course be available online? +

+ +

+6.002x will become available online on Monday, March 5. +

+ +

+Do I need to follow a set timeline in completing 6.002x? +

+ +

+In this pilot course of MITx, learners seeking a certificate will have weekly deadlines for homework and labs. Similarly, the midterm and final exam will be given within a specific range of days. However, faster-paced learners can proceed multiple weeks ahead if they choose. +

+ +

+How much time is required to complete the course? +

+

+Students should expect to spend approximately 10 hours per week on the course. However, the time taken by individual students might vary considerably depending on background and skill. +

+ +

+Who are the instructors for 6.002x? +

+

+There are four instructors for 6.002x: Anant Agarwal, Chris Terman, Gerald Sussman and Piotr Mitros. The team also includes several teaching assistants (TAs). +

+ +

+What is the work like in 6.002x? +

+

+Students taking 6.002x will have weekly video lectures, readings from the textbook, practice exercises and homework; design and laboratory exercises are also significant components of the course. The course will also provide additional tutorial material. There will be a midterm and a final exam. An interactive laboratory playground will also be made available for students to experiment creatively. +

+ +

+In general, for any given week, learners are expected to work through a couple of lecture sequences containing a few videos (each 5 to 10 minutes in length) and a few interactive practice exercises. Learners can also read appropriate parts of the textbook linked to the videos. Lab and homework exercises will round out the week. Tutorials are also provided as additional reference material. +

+ +

+What if I have a question during the course? +

+

+The course will include a discussion forum for learners to ask questions, to post answers, and for discussions. Several helpful documents, FAQs, tutorials and videos on using the various components of the course will also be provided. +

+ +

+Will 6.002x offer any means for collaboration among online learners? +

+

+Yes. 6.002x will offer modest support for collaborative work through a prototype wiki and discussion forum. +

+ +

+Are there prerequisites to take the course? +

+

+While MITx courses are open to all, there are some skills required to succeed in taking the course. +

+ +

+In 6.002x, students are encouraged to have the knowledge obtained from an AP or college-level physics course in electricity and magnetism. Students must know basic calculus and linear algebra, and have some basic background in 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. +

+ +

+How much does the course cost? +

+

+All of the courses on MITx will be free of charge. Those who have the ability and motivation to demonstrate mastery of content can receive a credential for a modest fee. For this prototype course, the fee for a credential will be waived. +

+ +

+What is a credential? +

+

+Any learner who successfully completes 6.002x will receive an electronic certificate indicating a grade. This certificate will indicate that you earned it from MITx’s pilot course. In this prototype version, MITx will not require that you be tested in a testing center or otherwise have your identity certified in order to receive this certificate. +

+ +

+Who is grading the course? +

+

+MITx courses will use automated technologies to check student work including practice exercises, homework assignments, labs and exams. +

+ +

+What is a passing grade? +

+

+Grading schemes for each course will be announced with the course. 6.002x will be graded on an absolute scale. The components affecting a student’s grade and the grade thresholds will be posted on the course website when the course comes online. +

+ +

+Do I need to buy a textbook? +

+

+The course uses the textbook Foundations of Analog and Digital Electronic Circuits, by Anant Agarwal and Jeffrey H. Lang. Morgan Kaufmann Publishers, Elsevier, July 2005. Relevant sections will be provided electronically as part of the online course. While the textbook is recommended, it is not required. The electronic text is provided for personal use in connection with this course only. The copyright for the book is owned by Elsevier. The book can be purchased on Amazon. +

+ +

+Do I need to have special software to access 6.002x? +

+

+No, you do not need special software to access 6.002x, as you will access the online interactive course through your browser. The course website was developed and tested primarily with Google Chrome. We support current versions of Mozilla Firefox as well. The video player is designed to work with Flash. While we provide a non-Flash fallback for the video, as well as partial support for Internet Explorer, other browsers and tablets, portions of the functionality will be unavailable. +

+ +

+When will the next courses become available and what topics will they be on? +

+

+ Additional courses will be announced on mitx.mit.edu as they become available. We expect this will happen in fall 2012. +

diff --git a/6002x-press-release.html b/6002x-press-release.html new file mode 100644 index 0000000000..b24f3836de --- /dev/null +++ b/6002x-press-release.html @@ -0,0 +1,83 @@ +<%inherit file="marketing.html" /> + +

MITx prototype course opens for enrollment—Online-learning initiative’s first offering, ‘6.002x: Circuits and Electronics,’ accepting registrants now.

+ +

MIT News Office

+ +

In December, MIT announced the launch of an online learning initiative called “MITx.” Starting this week, interested learners can now enroll for free in the initiative”s prototype course — 6.002x: Circuits and Electronics.

+ +

Students can sign up for the course at mitx.mit.edu. The course will officially begin on March 5 and run through June 8.

+ +

Modeled after MIT’s 6.002 — an introductory course for undergraduate students in MIT’s Department of Electrical Engineering and Computer Science (EECS) — 6.002x will introduce engineering in the context of the lumped circuit abstraction, helping students make the transition from physics to the fields of electrical engineering and computer science. It will be taught by Anant Agarwal, EECS professor and director of MIT”s Computer Science and Artificial Intelligence Laboratory (CSAIL); Chris Terman, CSAIL co-director; EECS Professor Gerald Sussman; and CSAIL Research Scientist Piotr Mitros.

+ +
+

+ “We are very excited to begin MITx with this prototype class,” says MIT Provost L. Rafael Reif. “We will use this prototype course to optimize the tools we have built by soliciting and acting on feedback from learners.” +

+
+ +

+To access the course, registered students will log in at mitx.mit.edu, where they will find a course schedule, an e-textbook for the course, and a discussion board. Each week, students will watch video lectures and demonstrations, work with practice exercises, complete homework assignments, and participate in an online interactive lab specifically designed to replicate its real-world counterpart. Students will also take exams and be able to check their grades as they progress in the course. Overall, students can expect to spend approximately 10 hours each week on the course. +

+ +
+“We invite you to join us for this pilot course of MITx,” Agarwal says. “The 6.002x team of professors and teaching assistants is excited to work with you on the discussion forum, and we look forward to your feedback to improve the learning experience.” +
+ +

A video introduction to 6.002x can be found here.

+ +

A set of Frequently Asked Questions about 6.002x can be found here.

+ +

+ +FAQs about MITx as a whole can be found here. + +

+ +

+At the end of the prototype course, students who demonstrate their mastery will be able to receive a certificate of completion for free. In future MITx courses, students who complete the mastery requirement on MITx will be able to receive the credential for a modest fee. +

+ +

+Enrollment in 6.002x is limited, and registrations will be taken on a first-come, first-served basis. Further courses are expected to become available beginning in the fall. +

+ + + + +

+RELATED: +

+

+ + 6.002x course website + +

+ +

+ + 6.002x FAQ + +

+ +

+ARCHIVE: “MIT launches online learning initiative” +

+ +http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html + + +

+MITx website +

+ +http://mitx.mit.edu + + +

+TAGS: +

+

+MITx; students; education, teaching, academics; innovation and invention; faculty; mit administration; learning; electrical engineering and computer science; csail +

+ diff --git a/mitx-overview.html b/mitx-overview.html new file mode 100644 index 0000000000..cbdffbb1ad --- /dev/null +++ b/mitx-overview.html @@ -0,0 +1,37 @@ +<%inherit file="marketing.html" /> + +

MITx Advances MIT’s Vision for Online Learning

+ +

Education has entered an era of rapid, exciting, technology-enabled change. At MIT, we welcome the opportunity to harness the power of on-line technology for our students and for the world. On December 19, 2011, we announced MITx, an initiative to offer exciting, challenging, and enriching courses to anyone, anywhere, who has the motivation and ability to engage MIT’s educational content.

+ +

Ten years ago, MIT launched OpenCourseware, which places online the course materials for substantially the entire MIT curriculum, and was the genesis of today’s worldwide movement in free, open educational resources. MITx is the next step in opening MIT’s educational doors to the world. Through OCW and MITx, MIT invites the world to join it in the passion, hard work, and thrill of learning and discovery.

+ +

MITx will e-publish interactive online courses that:

+ +
    +
  • Empower students to learn at their own pace;
    • +
  • Offer online laboratories where students can experiment and apply their learning;
    • +
  • Connect students to each other in online discussion groups and wiki-based collaborative learning;
    • +
  • Challenge learners with MIT-rigor course materials; and
    • +
  • Assess individual student learning as the student progresses through the course.
    • +
+ +

MITx students who demonstrate their mastery of a subject can earn a certificate of completion awarded by MITx.

+ +

MITx courses will be available to the world through an Internet platform that MIT will make freely available. MIT hopes that other educational institutions, anywhere in the world, will adapt and use the platform to publish their own educational content online for the benefit of learners. Because the platform will be open-source and scalable, adopters and users can continuously improve it, for the benefit of everyone.

+ +

Why Is MIT Creating MITx?

+ +

Excellence in teaching and learning. MIT must always provide its students the very best teaching and learning tools possible. MIT began experimenting with online technologies in its educational programs long before we launched OCW in 2001. We have only increased our emphasis in recent years, as several MIT committees have studied how MIT might enhance the learning experience of its students and expand its impact worldwide through new online offerings.

+ +

These efforts, combined with those of numerous individual MIT faculty members, confirmed MIT’s conviction that digital technologies enrich learning. Many other innovative institutions and enterprises believe the same and are bringing creative online offerings forward. Having brain-stormed, investigated, and studied, we were ready to act and eager to start. We announced our MITx aspiration to capture and encourage the energy of our faculty in creating new online teaching and learning tools.

+ +

Once up and running, MITx will be a laboratory for online learning. Whether MITx learners are MIT’s on-campus students, university students elsewhere, or independent learners, MITx will help us understand how online learning occurs and how virtual communities of learners assemble – information that in turn will allow us to improve both MITx and our on-campus teaching.

+ +

Access to higher education. MITx will help shatter barriers to education. The constraints of MIT’s physical campus allow us to admit less than 10 percent of our undergraduate applicants. We teach on-campus only a tiny fraction of the people in the world with the ability and motivation to learn MIT content. Online technology provides a new and different portal into MIT-quality education. Through MITx, MIT educational content can reach, augment, and enrich the education and livelihood of many learners who cannot attend MIT.

+ +

MITx does not provide a full MIT education. Our residential campus is the heart of MIT’s knowledge creation and dissemination. MIT students enjoy a comprehensive curriculum and distinct educational environment. Without MIT, there would be no MITx.

+ +

Advancing the public good. MITx is an opportunity to help preserve and expand higher education as a public good. Historically, the investment of public and private assets in enormous amounts has produced the public benefits of knowledge creation and dissemination, leading to capable citizens, innovation, job creation, economic development, and broader welfare.

+ +

Today, as computation and Internet technologies enable higher education to migrate online, MIT sees the opportunity to democratize education with unprecedented efficiency and scalability. We possess a strong desire and feel a compelling obligation to offer a not-for-profit, mission-driven, open-technology approach to online learning. MITx is our contribution.

From 5881c84c4728ec733d8e0282563f075ce11ed911 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Thu, 9 Feb 2012 18:09:37 -0500 Subject: [PATCH 08/46] Added links to the mitx page --- mitx_global.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/mitx_global.html b/mitx_global.html index 5505b84238..79d4882e33 100644 --- a/mitx_global.html +++ b/mitx_global.html @@ -27,7 +27,7 @@
  • operates on an open-source, scalable software infrastructure in order to make it continuously improving and readily available to other educational institutions, such as universities and K-12 school systems.
    • -

    Press & links: Boston Globe, New York Times, MIT Press Release, MITx FAQ

    +

    Press & links: Boston Globe, New York Times, MIT Press Release, MITx FAQ, MITx overview, 6.002x FAQ, 6.002x Press Release

    From e844c6317164192b60ed80ebb4445cee59cad4c1 Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Thu, 9 Feb 2012 20:55:38 -0500 Subject: [PATCH 09/46] Minor tweaks to e-mail templates --- activation_email_subject.txt | 2 +- registration/activation_email.txt | 6 ------ registration/activation_email_subject.txt | 1 - 3 files changed, 1 insertion(+), 8 deletions(-) delete mode 100644 registration/activation_email.txt delete mode 100644 registration/activation_email_subject.txt diff --git a/activation_email_subject.txt b/activation_email_subject.txt index bbe04cd341..00231fa8b1 100644 --- a/activation_email_subject.txt +++ b/activation_email_subject.txt @@ -1 +1 @@ -Your account for MIT's on-line 6.002 +Your account for MITx's on-line 6.002 diff --git a/registration/activation_email.txt b/registration/activation_email.txt deleted file mode 100644 index b594cd22d3..0000000000 --- a/registration/activation_email.txt +++ /dev/null @@ -1,6 +0,0 @@ -{% load humanize %} -Someone, hopefully you, signed up for a new account at djangoproject.com using this email address. If it was you, and you'd like to activate and use your account, click the link below or copy and paste it into your web browser's address bar: - -http://127.0.0.1:8000/accounts/activate/{{ activation_key }}/ - -If you didn't request this, you don't need to do anything; you won't receive any more email from us, and the account will expire automatically in {{ expiration_days|apnumber }} days. diff --git a/registration/activation_email_subject.txt b/registration/activation_email_subject.txt deleted file mode 100644 index 8ec5ec4413..0000000000 --- a/registration/activation_email_subject.txt +++ /dev/null @@ -1 +0,0 @@ -Activate your djangoproject.com account - you have {{ expiration_days }} days! From bb91ab2a5402be478608051df994ac32d104e398 Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Thu, 9 Feb 2012 21:06:37 -0500 Subject: [PATCH 10/46] More minor word tweaks --- activation_email.txt | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/activation_email.txt b/activation_email.txt index d61da883a2..0bd636428c 100644 --- a/activation_email.txt +++ b/activation_email.txt @@ -1,4 +1,4 @@ -Someone, hopefully you, signed up for an account for MIT's on-line +Someone, hopefully you, signed up for an account for MITx's on-line offering of 6.002 using this email address. If it was you, and you'd like to activate and use your account, copy and paste this address into your web browser's address bar: From ad2989f4a67491aa06ae075cca3acf3dc78e2b46 Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Thu, 9 Feb 2012 21:24:21 -0500 Subject: [PATCH 11/46] Fixed unescaped unicode characters --- 6002x-faq.html | 142 +++++++++++++++++++++++++++++++-------- 6002x-press-release.html | 72 +++++++++++++++----- mitx-overview.html | 82 +++++++++++++++++++--- 3 files changed, 242 insertions(+), 54 deletions(-) diff --git a/6002x-faq.html b/6002x-faq.html index 106344127f..f093bd03bf 100644 --- a/6002x-faq.html +++ b/6002x-faq.html @@ -4,47 +4,77 @@ More about 6.002x -

    Answering common questions about the first course on MITx, the Institute’s online-learning initiative.

    +

    Answering common questions about the first course on MITx, the +Institute’s online-learning initiative.

    -This set of questions and answers accompanies MIT’s February 13, 2012, announcement regarding MITx’s prototype course — 6.002x: Circuits and Electronics. +This set of questions and answers accompanies MIT’s February 13, +2012, announcement regarding MITx’s prototype course — +6.002x: Circuits and Electronics.

    -What is MITx?
MIT seeks through the development of MITx to improve education both on the MIT campus and around the world. +What is MITx? MIT seeks through the development of MITx to improve +education both on the MIT campus and around the world.

    -

    On campus, MITx will be coupled with an Institute-wide research initiative on online teaching and learning. The online learning tools that MITx develops will benefit the educational experience of residential students by supplementing and reinforcing the classroom and laboratory experiences.

    +

    On campus, MITx will be coupled with an Institute-wide research +initiative on online teaching and learning. The online learning tools +that MITx develops will benefit the educational experience of +residential students by supplementing and reinforcing the classroom +and laboratory experiences.

    -Beyond the MIT campus, MITx will endeavor to break down barriers to education in two ways. First, it will offer the online teaching of MIT courses to people around the world and the opportunity for able learners to gain certification of mastery of MIT material. Second, it will make freely available to educational institutions everywhere the open-source software infrastructure on which MITx courses are based. +Beyond the MIT campus, MITx will endeavor to break down barriers to +education in two ways. First, it will offer the online teaching of MIT +courses to people around the world and the opportunity for able +learners to gain certification of mastery of MIT material. Second, it +will make freely available to educational institutions everywhere the +open-source software infrastructure on which MITx courses are based.

    -Since it launched OpenCourseWare 10 years ago, MIT has been committed to using technology to improve and greatly widen access to education. The launch of MITx represents a next step forward in that effort. +Since it launched OpenCourseWare 10 years ago, MIT has been committed +to using technology to improve and greatly widen access to +education. The launch of MITx represents a next step forward in that +effort.

    -What is 6.002x, and how is it different from the on-campus version of 6.002? +What is 6.002x, and how is it different from the on-campus version of +6.002?

    -At MIT, each course is assigned a number. All courses in the Department of Electrical Engineering and Computer Science (EECS) start with the number 6, and 6.002 (also known as Circuits and Electronics) is one of the introductory courses for EECS undergraduates. MITx’s 6.002x is modeled on the on-campus version of 6.002. +At MIT, each course is assigned a number. All courses in the +Department of Electrical Engineering and Computer Science (EECS) start +with the number 6, and 6.002 (also known as Circuits and Electronics) +is one of the introductory courses for EECS +undergraduates. MITx’s 6.002x is modeled on the on-campus +version of 6.002.

    - The course introduces engineering in the context of the lumped circuit abstraction. Topics covered include: resistive elements and networks; independent and dependent sources; switches and MOS transistors; digital abstraction; amplifiers; energy storage elements; dynamics of first- and second-order networks; design in the time and frequency domains; and analog and digital circuits and applications. + The course introduces engineering in the context of the lumped + circuit abstraction. Topics covered include: resistive elements and + networks; independent and dependent sources; switches and MOS + transistors; digital abstraction; amplifiers; energy storage + elements; dynamics of first- and second-order networks; design in + the time and frequency domains; and analog and digital circuits and + applications.

    -6.002x is built on the content created collaboratively by MIT professors Anant Agarwal and Jeffrey H. Lang for 6.002. +6.002x is built on the content created collaboratively by MIT +professors Anant Agarwal and Jeffrey H. Lang for 6.002.

    How do I enroll in 6.002x?

    -To enroll, visit http://mitx.mit.edu and sign up. +To enroll, visit http://mitx.mit.edu +and sign up.

    @@ -60,108 +90,164 @@ Do I need to follow a set timeline in completing 6.002x?

    -In this pilot course of MITx, learners seeking a certificate will have weekly deadlines for homework and labs. Similarly, the midterm and final exam will be given within a specific range of days. However, faster-paced learners can proceed multiple weeks ahead if they choose. +In this pilot course of MITx, learners seeking a certificate will have +weekly deadlines for homework and labs. Similarly, the midterm and +final exam will be given within a specific range of days. However, +faster-paced learners can proceed multiple weeks ahead if they choose.

    How much time is required to complete the course?

    -Students should expect to spend approximately 10 hours per week on the course. However, the time taken by individual students might vary considerably depending on background and skill. +Students should expect to spend approximately 10 hours per week on the +course. However, the time taken by individual students might vary +considerably depending on background and skill.

    Who are the instructors for 6.002x?

    -There are four instructors for 6.002x: Anant Agarwal, Chris Terman, Gerald Sussman and Piotr Mitros. The team also includes several teaching assistants (TAs). +There are four instructors for 6.002x: Anant Agarwal, Chris Terman, +Gerald Sussman and Piotr Mitros. The team also includes several +teaching assistants (TAs).

    What is the work like in 6.002x?

    -Students taking 6.002x will have weekly video lectures, readings from the textbook, practice exercises and homework; design and laboratory exercises are also significant components of the course. The course will also provide additional tutorial material. There will be a midterm and a final exam. An interactive laboratory playground will also be made available for students to experiment creatively. +Students taking 6.002x will have weekly video lectures, readings from +the textbook, practice exercises and homework; design and laboratory +exercises are also significant components of the course. The course +will also provide additional tutorial material. There will be a +midterm and a final exam. An interactive laboratory playground will +also be made available for students to experiment creatively.

    -In general, for any given week, learners are expected to work through a couple of lecture sequences containing a few videos (each 5 to 10 minutes in length) and a few interactive practice exercises. Learners can also read appropriate parts of the textbook linked to the videos. Lab and homework exercises will round out the week. Tutorials are also provided as additional reference material. +In general, for any given week, learners are expected to work through +a couple of lecture sequences containing a few videos (each 5 to 10 +minutes in length) and a few interactive practice exercises. Learners +can also read appropriate parts of the textbook linked to the +videos. Lab and homework exercises will round out the week. Tutorials +are also provided as additional reference material.

    What if I have a question during the course?

    -The course will include a discussion forum for learners to ask questions, to post answers, and for discussions. Several helpful documents, FAQs, tutorials and videos on using the various components of the course will also be provided. +The course will include a discussion forum for learners to ask +questions, to post answers, and for discussions. Several helpful +documents, FAQs, tutorials and videos on using the various components +of the course will also be provided.

    Will 6.002x offer any means for collaboration among online learners?

    -Yes. 6.002x will offer modest support for collaborative work through a prototype wiki and discussion forum. +Yes. 6.002x will offer modest support for collaborative work through a +prototype wiki and discussion forum.

    Are there prerequisites to take the course?

    -While MITx courses are open to all, there are some skills required to succeed in taking the course. +While MITx courses are open to all, there are some skills required to +succeed in taking the course.

    -In 6.002x, students are encouraged to have the knowledge obtained from an AP or college-level physics course in electricity and magnetism. Students must know basic calculus and linear algebra, and have some basic background in differential equations. +In 6.002x, students are encouraged to have the knowledge obtained from +an AP or college-level physics course in electricity and +magnetism. Students must know basic calculus and linear algebra, and +have some basic background in 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. +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.

    How much does the course cost?

    -All of the courses on MITx will be free of charge. Those who have the ability and motivation to demonstrate mastery of content can receive a credential for a modest fee. For this prototype course, the fee for a credential will be waived. +All of the courses on MITx will be free of charge. Those who have the +ability and motivation to demonstrate mastery of content can receive a +credential for a modest fee. For this prototype course, the fee for a +credential will be waived.

    What is a credential?

    -Any learner who successfully completes 6.002x will receive an electronic certificate indicating a grade. This certificate will indicate that you earned it from MITx’s pilot course. In this prototype version, MITx will not require that you be tested in a testing center or otherwise have your identity certified in order to receive this certificate. +Any learner who successfully completes 6.002x will receive an +electronic certificate indicating a grade. This certificate will +indicate that you earned it from MITx’s pilot course. In this +prototype version, MITx will not require that you be tested in a +testing center or otherwise have your identity certified in order to +receive this certificate.

    Who is grading the course?

    -MITx courses will use automated technologies to check student work including practice exercises, homework assignments, labs and exams. +MITx courses will use automated technologies to check student work +including practice exercises, homework assignments, labs and exams.

    What is a passing grade?

    -Grading schemes for each course will be announced with the course. 6.002x will be graded on an absolute scale. The components affecting a student’s grade and the grade thresholds will be posted on the course website when the course comes online. +Grading schemes for each course will be announced with the +course. 6.002x will be graded on an absolute scale. The components +affecting a student’s grade and the grade thresholds will be +posted on the course website when the course comes online.

    Do I need to buy a textbook?

    -The course uses the textbook Foundations of Analog and Digital Electronic Circuits, by Anant Agarwal and Jeffrey H. Lang. Morgan Kaufmann Publishers, Elsevier, July 2005. Relevant sections will be provided electronically as part of the online course. While the textbook is recommended, it is not required. The electronic text is provided for personal use in connection with this course only. The copyright for the book is owned by Elsevier. The book can be purchased on Amazon. +The course uses the textbook Foundations of Analog and Digital +Electronic Circuits, by Anant Agarwal and Jeffrey H. Lang. Morgan +Kaufmann Publishers, Elsevier, July 2005. Relevant sections will be +provided electronically as part of the online course. While the +textbook is recommended, it is not required. The electronic text is +provided for personal use in connection with this course only. The +copyright for the book is owned by Elsevier. The book can be purchased +on Amazon.

    Do I need to have special software to access 6.002x?

    -No, you do not need special software to access 6.002x, as you will access the online interactive course through your browser. The course website was developed and tested primarily with Google Chrome. We support current versions of Mozilla Firefox as well. The video player is designed to work with Flash. While we provide a non-Flash fallback for the video, as well as partial support for Internet Explorer, other browsers and tablets, portions of the functionality will be unavailable. +No, you do not need special software to access 6.002x, as you will +access the online interactive course through your browser. The course +website was developed and tested primarily with Google Chrome. We +support current versions of Mozilla Firefox as well. The video player +is designed to work with Flash. While we provide a partial non-Flash +fallback for the video, as well as partial support for Internet +Explorer, other browsers and tablets, portions of the functionality +will be unavailable.

    When will the next courses become available and what topics will they be on?

    - Additional courses will be announced on mitx.mit.edu as they become available. We expect this will happen in fall 2012. + Additional courses will be announced + on mitx.mit.edu as they become + available. We expect this will happen in fall 2012.

    diff --git a/6002x-press-release.html b/6002x-press-release.html index b24f3836de..f5e319e8dc 100644 --- a/6002x-press-release.html +++ b/6002x-press-release.html @@ -1,32 +1,68 @@ <%inherit file="marketing.html" /> -

    MITx prototype course opens for enrollment—Online-learning initiative’s first offering, ‘6.002x: Circuits and Electronics,’ accepting registrants now.

    +

    MITx prototype course opens for enrollment—Online-learning +initiative’s first offering, ‘6.002x: Circuits and +Electronics,’ accepting registrants now.

    MIT News Office

    -

    In December, MIT announced the launch of an online learning initiative called “MITx.” Starting this week, interested learners can now enroll for free in the initiative”s prototype course — 6.002x: Circuits and Electronics.

    +

    In December, +MIT announced the +launch of an online learning initiative called “MITx.” +Starting this week, interested learners can now enroll for free in the +initiative”s prototype course -- 6.002x: Circuits and +Electronics.

    -

    Students can sign up for the course at mitx.mit.edu. The course will officially begin on March 5 and run through June 8.

    +

    Students can sign up for the course +at mitx.mit.edu. The course will +officially begin on March 5 and run through June 8.

    -

    Modeled after MIT’s 6.002 — an introductory course for undergraduate students in MIT’s Department of Electrical Engineering and Computer Science (EECS) — 6.002x will introduce engineering in the context of the lumped circuit abstraction, helping students make the transition from physics to the fields of electrical engineering and computer science. It will be taught by Anant Agarwal, EECS professor and director of MIT”s Computer Science and Artificial Intelligence Laboratory (CSAIL); Chris Terman, CSAIL co-director; EECS Professor Gerald Sussman; and CSAIL Research Scientist Piotr Mitros.

    +

    Modeled after MIT’s 6.002 — an introductory course for +undergraduate students in MIT’s Department of Electrical +Engineering and Computer Science (EECS) — 6.002x will introduce +engineering in the context of the lumped circuit abstraction, helping +students make the transition from physics to the fields of electrical +engineering and computer science. It will be taught by Anant Agarwal, +EECS professor and director of MIT”s Computer Science and +Artificial Intelligence Laboratory (CSAIL); Chris Terman, CSAIL +co-director; EECS Professor Gerald Sussman; and CSAIL Research +Scientist Piotr Mitros.

    - “We are very excited to begin MITx with this prototype class,” says MIT Provost L. Rafael Reif. “We will use this prototype course to optimize the tools we have built by soliciting and acting on feedback from learners.” + “We are very excited to begin MITx with this prototype + class,” says MIT Provost L. Rafael Reif. “We will use + this prototype course to optimize the tools we have built by + soliciting and acting on feedback from learners.”

    -To access the course, registered students will log in at mitx.mit.edu, where they will find a course schedule, an e-textbook for the course, and a discussion board. Each week, students will watch video lectures and demonstrations, work with practice exercises, complete homework assignments, and participate in an online interactive lab specifically designed to replicate its real-world counterpart. Students will also take exams and be able to check their grades as they progress in the course. Overall, students can expect to spend approximately 10 hours each week on the course. +To access the course, registered students will log in +at mitx.mit.edu, where they will +find a course schedule, an e-textbook for the course, and a discussion +board. Each week, students will watch video lectures and +demonstrations, work with practice exercises, complete homework +assignments, and participate in an online interactive lab specifically +designed to replicate its real-world counterpart. Students will also +take exams and be able to check their grades as they progress in the +course. Overall, students can expect to spend approximately 10 hours +each week on the course.

    -“We invite you to join us for this pilot course of MITx,” Agarwal says. “The 6.002x team of professors and teaching assistants is excited to work with you on the discussion forum, and we look forward to your feedback to improve the learning experience.” +“We invite you to join us for this pilot course of MITx,” +Agarwal says. “The 6.002x team of professors and teaching +assistants is excited to work with you on the discussion forum, and we +look forward to your feedback to improve the learning +experience.”
    -

    A video introduction to 6.002x can be found here.

    +

    A video introduction to 6.002x can +be found here.

    -

    A set of Frequently Asked Questions about 6.002x can be found here.

    +

    A set of Frequently Asked Questions +about 6.002x can be found here.

    @@ -35,16 +71,20 @@ FAQs about MITx as a whole can be found here.

    -At the end of the prototype course, students who demonstrate their mastery will be able to receive a certificate of completion for free. In future MITx courses, students who complete the mastery requirement on MITx will be able to receive the credential for a modest fee. +At the end of the prototype course, students who demonstrate their +mastery will be able to receive a certificate of completion for +free. In future MITx courses, students who complete the mastery +requirement on MITx will be able to receive the credential for a +modest fee.

    -Enrollment in 6.002x is limited, and registrations will be taken on a first-come, first-served basis. Further courses are expected to become available beginning in the fall. +Enrollment in 6.002x is limited, and registrations will be taken on a +first-come, first-served basis. Further courses are expected to become +available beginning in the fall.

    - -

    RELATED:

    @@ -61,7 +101,7 @@ RELATED:

    -ARCHIVE: “MIT launches online learning initiative” +ARCHIVE: "MIT launches online learning initiative"

    http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html @@ -78,6 +118,8 @@ http://mitx.mit.edu TAGS:

    -MITx; students; education, teaching, academics; innovation and invention; faculty; mit administration; learning; electrical engineering and computer science; csail +MITx; students; education, teaching, academics; innovation and +invention; faculty; mit administration; learning; electrical +engineering and computer science; csail

    diff --git a/mitx-overview.html b/mitx-overview.html index cbdffbb1ad..7f0661275f 100644 --- a/mitx-overview.html +++ b/mitx-overview.html @@ -2,9 +2,22 @@

    MITx Advances MIT’s Vision for Online Learning

    -

    Education has entered an era of rapid, exciting, technology-enabled change. At MIT, we welcome the opportunity to harness the power of on-line technology for our students and for the world. On December 19, 2011, we announced MITx, an initiative to offer exciting, challenging, and enriching courses to anyone, anywhere, who has the motivation and ability to engage MIT’s educational content.

    +

    Education has entered an era of rapid, exciting, +technology-enabled change. At MIT, we welcome the opportunity to +harness the power of on-line technology for our students and for the +world. On December 19, 2011, we announced MITx, an initiative to +offer exciting, challenging, and enriching courses to anyone, +anywhere, who has the motivation and ability to engage MIT’s +educational content.

    -

    Ten years ago, MIT launched OpenCourseware, which places online the course materials for substantially the entire MIT curriculum, and was the genesis of today’s worldwide movement in free, open educational resources. MITx is the next step in opening MIT’s educational doors to the world. Through OCW and MITx, MIT invites the world to join it in the passion, hard work, and thrill of learning and discovery.

    +

    Ten years ago, MIT +launched OpenCourseware, +which places online the course materials for substantially the entire +MIT curriculum, and was the genesis of today’s worldwide +movement in free, open educational resources. MITx is the next step +in opening MIT’s educational doors to the world. Through OCW and +MITx, MIT invites the world to join it in the passion, hard work, and +thrill of learning and discovery.

    MITx will e-publish interactive online courses that:

    @@ -16,22 +29,69 @@
  • Assess individual student learning as the student progresses through the course.
    • -

    MITx students who demonstrate their mastery of a subject can earn a certificate of completion awarded by MITx.

    +

    MITx students who demonstrate their mastery of a subject can earn +a certificate of completion awarded by MITx.

    -

    MITx courses will be available to the world through an Internet platform that MIT will make freely available. MIT hopes that other educational institutions, anywhere in the world, will adapt and use the platform to publish their own educational content online for the benefit of learners. Because the platform will be open-source and scalable, adopters and users can continuously improve it, for the benefit of everyone.

    +

    MITx courses will be available to the world through an Internet +platform that MIT will make freely available. MIT hopes that other +educational institutions, anywhere in the world, will adapt and use +the platform to publish their own educational content online for the +benefit of learners. Because the platform will be open-source and +scalable, adopters and users can continuously improve it, for the +benefit of everyone.

    Why Is MIT Creating MITx?

    -

    Excellence in teaching and learning. MIT must always provide its students the very best teaching and learning tools possible. MIT began experimenting with online technologies in its educational programs long before we launched OCW in 2001. We have only increased our emphasis in recent years, as several MIT committees have studied how MIT might enhance the learning experience of its students and expand its impact worldwide through new online offerings.

    +

    Excellence in teaching and learning. MIT must always provide its +students the very best teaching and learning tools possible. MIT +began experimenting with online technologies in its educational +programs long before we launched OCW in 2001. We have only increased +our emphasis in recent years, as several MIT committees have studied +how MIT might enhance the learning experience of its students and +expand its impact worldwide through new online offerings.

    -

    These efforts, combined with those of numerous individual MIT faculty members, confirmed MIT’s conviction that digital technologies enrich learning. Many other innovative institutions and enterprises believe the same and are bringing creative online offerings forward. Having brain-stormed, investigated, and studied, we were ready to act and eager to start. We announced our MITx aspiration to capture and encourage the energy of our faculty in creating new online teaching and learning tools.

    +

    These efforts, combined with those of numerous individual MIT +faculty members, confirmed MIT’s conviction that digital +technologies enrich learning. Many other innovative institutions and +enterprises believe the same and are bringing creative online +offerings forward. Having brain-stormed, investigated, and studied, +we were ready to act and eager to start. We announced our MITx +aspiration to capture and encourage the energy of our faculty in +creating new online teaching and learning tools.

    -

    Once up and running, MITx will be a laboratory for online learning. Whether MITx learners are MIT’s on-campus students, university students elsewhere, or independent learners, MITx will help us understand how online learning occurs and how virtual communities of learners assemble – information that in turn will allow us to improve both MITx and our on-campus teaching.

    +

    Once up and running, MITx will be a laboratory for online +learning. Whether MITx learners are MIT’s on-campus students, +university students elsewhere, or independent learners, MITx will help +us understand how online learning occurs and how virtual communities +of learners assemble -- information that in turn will allow us to +improve both MITx and our on-campus teaching.

    -

    Access to higher education. MITx will help shatter barriers to education. The constraints of MIT’s physical campus allow us to admit less than 10 percent of our undergraduate applicants. We teach on-campus only a tiny fraction of the people in the world with the ability and motivation to learn MIT content. Online technology provides a new and different portal into MIT-quality education. Through MITx, MIT educational content can reach, augment, and enrich the education and livelihood of many learners who cannot attend MIT.

    +

    Access to higher education. MITx will help shatter barriers to +education. The constraints of MIT’s physical campus allow us to +admit less than 10 percent of our undergraduate applicants. We teach +on-campus only a tiny fraction of the people in the world with the +ability and motivation to learn MIT content. Online technology +provides a new and different portal into MIT-quality education. +Through MITx, MIT educational content can reach, augment, and enrich +the education and livelihood of many learners who cannot attend +MIT.

    -

    MITx does not provide a full MIT education. Our residential campus is the heart of MIT’s knowledge creation and dissemination. MIT students enjoy a comprehensive curriculum and distinct educational environment. Without MIT, there would be no MITx.

    +

    MITx does not provide a full MIT education. Our residential +campus is the heart of MIT’s knowledge creation and +dissemination. MIT students enjoy a comprehensive curriculum and +distinct educational environment. Without MIT, there would be no +MITx.

    -

    Advancing the public good. MITx is an opportunity to help preserve and expand higher education as a public good. Historically, the investment of public and private assets in enormous amounts has produced the public benefits of knowledge creation and dissemination, leading to capable citizens, innovation, job creation, economic development, and broader welfare.

    +

    Advancing the public good. MITx is an opportunity to help +preserve and expand higher education as a public good. Historically, +the investment of public and private assets in enormous amounts has +produced the public benefits of knowledge creation and dissemination, +leading to capable citizens, innovation, job creation, economic +development, and broader welfare.

    -

    Today, as computation and Internet technologies enable higher education to migrate online, MIT sees the opportunity to democratize education with unprecedented efficiency and scalability. We possess a strong desire and feel a compelling obligation to offer a not-for-profit, mission-driven, open-technology approach to online learning. MITx is our contribution.

    +

    Today, as computation and Internet technologies enable higher +education to migrate online, MIT sees the opportunity to democratize +education with unprecedented efficiency and scalability. We possess a +strong desire and feel a compelling obligation to offer a +not-for-profit, mission-driven, open-technology approach to online +learning. MITx is our contribution.

    From 3c7dc27259de9cccc90efa472562c938d0f3f752 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Fri, 10 Feb 2012 11:02:50 -0500 Subject: [PATCH 12/46] Fixed probelms with layout of three new pages and made small chages requested by Anant --- 6002x-faq.html | 4 ++++ 6002x-press-release.html | 5 ++++- index.html | 2 +- mitx-overview.html | 5 +++++ mitx_global.html | 2 +- 5 files changed, 15 insertions(+), 3 deletions(-) diff --git a/6002x-faq.html b/6002x-faq.html index f093bd03bf..335034abc9 100644 --- a/6002x-faq.html +++ b/6002x-faq.html @@ -1,4 +1,6 @@ <%inherit file="marketing.html" /> +
    +

    More about 6.002x @@ -251,3 +253,5 @@ When will the next courses become available and what topics will they be on? on mitx.mit.edu as they become available. We expect this will happen in fall 2012.

    +

    +
    diff --git a/6002x-press-release.html b/6002x-press-release.html index f5e319e8dc..5a2a53df75 100644 --- a/6002x-press-release.html +++ b/6002x-press-release.html @@ -1,4 +1,6 @@ <%inherit file="marketing.html" /> +
    +

    MITx prototype course opens for enrollment—Online-learning initiative’s first offering, ‘6.002x: Circuits and @@ -122,4 +124,5 @@ MITx; students; education, teaching, academics; innovation and invention; faculty; mit administration; learning; electrical engineering and computer science; csail

    - +

    +
    diff --git a/index.html b/index.html index 1e37891a58..ff32f6a336 100644 --- a/index.html +++ b/index.html @@ -7,7 +7,7 @@

    6.002x

    Enroll in 6.002x Circuits & Electronics -

    6.002x (Circuits and Electronics) is an experimental on-line adaptation of MIT’s first undergraduate analog design course: 6.002. This course will run, free of charge, for students worldwide from March 1, 2012 through June 8, 2012.

    +

    6.002x (Circuits and Electronics) is an experimental on-line adaptation of MIT’s first undergraduate analog design course: 6.002. This course will run, free of charge, for students worldwide from March 5, 2012 through June 8, 2012.

    diff --git a/mitx-overview.html b/mitx-overview.html index 7f0661275f..4e4fb70b45 100644 --- a/mitx-overview.html +++ b/mitx-overview.html @@ -1,4 +1,6 @@ <%inherit file="marketing.html" /> +
    +

    MITx Advances MIT’s Vision for Online Learning

    @@ -95,3 +97,6 @@ education with unprecedented efficiency and scalability. We possess a strong desire and feel a compelling obligation to offer a not-for-profit, mission-driven, open-technology approach to online learning. MITx is our contribution.

    + +
    +
    diff --git a/mitx_global.html b/mitx_global.html index 79d4882e33..ee89e655f8 100644 --- a/mitx_global.html +++ b/mitx_global.html @@ -27,7 +27,7 @@
  • operates on an open-source, scalable software infrastructure in order to make it continuously improving and readily available to other educational institutions, such as universities and K-12 school systems.
    • -

    Press & links: Boston Globe, New York Times, MIT Press Release, MITx FAQ, MITx overview, 6.002x FAQ, 6.002x Press Release

    +

    Press & links: 6.002x Press Release, 6.002x FAQ, MITx overview, Boston Globe, New York Times, MIT Press Release, MITx FAQ,

    From 2359de96eb190a7396c63bd3392028f44f2efb75 Mon Sep 17 00:00:00 2001 From: David Ormsbee Date: Fri, 10 Feb 2012 11:15:18 -0500 Subject: [PATCH 13/46] Replace hardcoded url in password reset notification email with site name (from django_site table) --- registration/password_reset_email.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/registration/password_reset_email.html b/registration/password_reset_email.html index 7f8cdbe927..d5c4da23c1 100644 --- a/registration/password_reset_email.html +++ b/registration/password_reset_email.html @@ -3,7 +3,7 @@ {% trans "Please go to the following page and choose a new password:" %} {% block reset_link %} -https://6002x.mitx.mit.edu{% url 'django.contrib.auth.views.password_reset_confirm' uidb36=uid token=token %} +{{ protocol }}://{{ site_name }}{% url 'django.contrib.auth.views.password_reset_confirm' uidb36=uid token=token %} {% endblock %} {% trans "Your username, in case you've forgotten:" %} {{ user.username }} From 6779e9b45ea009a9d4fedb2128e420b4b85579dd Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Fri, 10 Feb 2012 11:19:41 -0500 Subject: [PATCH 14/46] Added screen fix for smaller screens on secondary pages --- sass/_index-extends.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/sass/_index-extends.scss b/sass/_index-extends.scss index 4e4fe8e3fa..2d3f911633 100644 --- a/sass/_index-extends.scss +++ b/sass/_index-extends.scss @@ -14,6 +14,10 @@ > div { padding-left: flex-grid(4) + flex-gutter(); + @media screen and (max-width: 940px) { + padding-left: 0; + } + p { margin-bottom: lh(); } From bb7d1615b5e86892a2a5c595796a85d159066213 Mon Sep 17 00:00:00 2001 From: Ernie Park Date: Fri, 10 Feb 2012 12:10:01 -0500 Subject: [PATCH 15/46] put video control toggle into a function --HG-- branch : templates-ernie-html5-buttontoggle --- video_init.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/video_init.js b/video_init.js index e10d85095f..0ec2fe2e2c 100644 --- a/video_init.js +++ b/video_init.js @@ -58,18 +58,18 @@ for(var i=0; i Date: Fri, 10 Feb 2012 12:26:44 -0500 Subject: [PATCH 16/46] Merge, minor correction to e-mail --- mitx_global.html | 2 +- registration/password_reset_confirm.html | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/mitx_global.html b/mitx_global.html index ee89e655f8..cb286edee0 100644 --- a/mitx_global.html +++ b/mitx_global.html @@ -27,7 +27,7 @@
  • operates on an open-source, scalable software infrastructure in order to make it continuously improving and readily available to other educational institutions, such as universities and K-12 school systems.
    • -

    Press & links: 6.002x Press Release, 6.002x FAQ, MITx overview, Boston Globe, New York Times, MIT Press Release, MITx FAQ,

    +

    Press & links: 6.002x Press Release, 6.002x FAQ, MITx overview, Boston Globe, New York Times, MIT Press Release, MITx FAQ,

    diff --git a/registration/password_reset_confirm.html b/registration/password_reset_confirm.html index dea7e8a2d3..fa9538f0e7 100644 --- a/registration/password_reset_confirm.html +++ b/registration/password_reset_confirm.html @@ -18,7 +18,7 @@

    Password reset unsuccessful

    -

    The password reset link was invalid, possibly because it has already been used. Please request a new password reset.

    +

    The password reset link was invalid, possibly because the link has already been used. Please request a new password reset.

    {% endif %} From a4e57aeb47e8e45f5ec422eed4aa4b57e15f2d80 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Fri, 10 Feb 2012 16:44:30 -0500 Subject: [PATCH 17/46] Made changes to Anants three pages --- 6002x-faq.html | 30 +++++++++--------- 6002x-press-release.html | 3 +- mitx-overview.html | 66 ++++++++++++++++++++-------------------- 3 files changed, 49 insertions(+), 50 deletions(-) diff --git a/6002x-faq.html b/6002x-faq.html index 335034abc9..832f8df02a 100644 --- a/6002x-faq.html +++ b/6002x-faq.html @@ -57,13 +57,13 @@ version of 6.002.

    - The course introduces engineering in the context of the lumped - circuit abstraction. Topics covered include: resistive elements and - networks; independent and dependent sources; switches and MOS - transistors; digital abstraction; amplifiers; energy storage - elements; dynamics of first- and second-order networks; design in - the time and frequency domains; and analog and digital circuits and - applications. + The course introduces engineering in the context of the lumped + circuit abstraction. Topics covered include: resistive elements and + networks; independent and dependent sources; switches and MOS + transistors; digital abstraction; amplifiers; energy storage + elements; dynamics of first- and second-order networks; design in + the time and frequency domains; and analog and digital circuits and + applications.

    @@ -165,8 +165,8 @@ succeed in taking the course.

    In 6.002x, students are encouraged to have the knowledge obtained from -an AP or college-level physics course in electricity and -magnetism. Students must know basic calculus and linear algebra, and +a college-level physics course in electricity and +magnetism (or from an advanced secondary-education course in electricity and magnetism, as with an Advanced Placement course in the United States). Students must know basic calculus and linear algebra, and have some basic background in differential equations.

    @@ -218,14 +218,14 @@ posted on the course website when the course comes online.

    -Do I need to buy a textbook? +Do I need to buy a textbook?

    The course uses the textbook Foundations of Analog and Digital Electronic Circuits, by Anant Agarwal and Jeffrey H. Lang. Morgan Kaufmann Publishers, Elsevier, July 2005. Relevant sections will be -provided electronically as part of the online course. While the -textbook is recommended, it is not required. The electronic text is +provided electronically as part of the online course. While the +textbook is recommended, it is not required. The electronic text is provided for personal use in connection with this course only. The copyright for the book is owned by Elsevier. The book can be purchased on Amazon. @@ -249,9 +249,9 @@ will be unavailable. When will the next courses become available and what topics will they be on?

    - Additional courses will be announced - on mitx.mit.edu as they become - available. We expect this will happen in fall 2012. + Additional courses will be announced + on mitx.mit.edu as they become + available. We expect this will happen in fall 2012.

    diff --git a/6002x-press-release.html b/6002x-press-release.html index 5a2a53df75..05f44a300f 100644 --- a/6002x-press-release.html +++ b/6002x-press-release.html @@ -81,8 +81,7 @@ modest fee.

    -Enrollment in 6.002x is limited, and registrations will be taken on a -first-come, first-served basis. Further courses are expected to become +Further courses are expected to become available beginning in the fall.

    diff --git a/mitx-overview.html b/mitx-overview.html index 4e4fb70b45..d278faf0c1 100644 --- a/mitx-overview.html +++ b/mitx-overview.html @@ -7,85 +7,85 @@

    Education has entered an era of rapid, exciting, technology-enabled change. At MIT, we welcome the opportunity to harness the power of on-line technology for our students and for the -world. On December 19, 2011, we announced MITx, an initiative to -offer exciting, challenging, and enriching courses to anyone, +world. On December 19, 2011, we announced MITx, an initiative to +offer exciting, challenging and enriching courses to anyone, anywhere, who has the motivation and ability to engage MIT’s educational content.

    Ten years ago, MIT -launched OpenCourseware, +launched OpenCourseWare, which places online the course materials for substantially the entire MIT curriculum, and was the genesis of today’s worldwide -movement in free, open educational resources. MITx is the next step +movement in free, open educational resources. MITx is the next step in opening MIT’s educational doors to the world. Through OCW and -MITx, MIT invites the world to join it in the passion, hard work, and +MITx, MIT invites the world to join it in the passion, hard work and thrill of learning and discovery.

    MITx will e-publish interactive online courses that:

      -
    • Empower students to learn at their own pace;
      • -
    • Offer online laboratories where students can experiment and apply their learning;
      • -
    • Connect students to each other in online discussion groups and wiki-based collaborative learning;
      • -
    • Challenge learners with MIT-rigor course materials; and
      • -
    • Assess individual student learning as the student progresses through the course.
      • +
    • Empower students to learn at their own pace;
      • +
    • Offer online laboratories where students can experiment and apply their learning;
      • +
    • Connect students to each other in online discussion groups and wiki-based collaborative learning;
      • +
    • Challenge learners with MIT-rigor course materials; and
      • +
    • Assess individual student learning as the student progresses through the course.

    MITx students who demonstrate their mastery of a subject can earn a certificate of completion awarded by MITx.

    MITx courses will be available to the world through an Internet -platform that MIT will make freely available. MIT hopes that other +platform that MIT will make freely available. MIT hopes that other educational institutions, anywhere in the world, will adapt and use the platform to publish their own educational content online for the -benefit of learners. Because the platform will be open-source and +benefit of learners. Because the platform will be open-source and scalable, adopters and users can continuously improve it, for the benefit of everyone.

    Why Is MIT Creating MITx?

    -

    Excellence in teaching and learning. MIT must always provide its -students the very best teaching and learning tools possible. MIT +

    Excellence in teaching and learning. MIT must always provide its +students the very best teaching and learning tools possible. MIT began experimenting with online technologies in its educational -programs long before we launched OCW in 2001. We have only increased +programs long before we launched OCW in 2001. We have only increased our emphasis in recent years, as several MIT committees have studied how MIT might enhance the learning experience of its students and expand its impact worldwide through new online offerings.

    These efforts, combined with those of numerous individual MIT faculty members, confirmed MIT’s conviction that digital -technologies enrich learning. Many other innovative institutions and +technologies enrich learning. Many other innovative institutions and enterprises believe the same and are bringing creative online -offerings forward. Having brain-stormed, investigated, and studied, -we were ready to act and eager to start. We announced our MITx +offerings forward. Having brain-stormed, investigated and studied, +we were ready to act and eager to start. We announced our MITx aspiration to capture and encourage the energy of our faculty in -creating new online teaching and learning tools.

    +creating new online teaching and learning tools.

    Once up and running, MITx will be a laboratory for online -learning. Whether MITx learners are MIT’s on-campus students, +learning. Whether MITx learners are MIT’s on-campus students, university students elsewhere, or independent learners, MITx will help us understand how online learning occurs and how virtual communities of learners assemble -- information that in turn will allow us to -improve both MITx and our on-campus teaching.

    +improve both MITx and our on-campus teaching.

    -

    Access to higher education. MITx will help shatter barriers to -education. The constraints of MIT’s physical campus allow us to -admit less than 10 percent of our undergraduate applicants. We teach +

    Access to higher education. MITx will help shatter barriers to +education. The constraints of MIT’s physical campus allow us to +admit less than 10 percent of our undergraduate applicants. We teach on-campus only a tiny fraction of the people in the world with the -ability and motivation to learn MIT content. Online technology +ability and motivation to learn MIT content. Online technology provides a new and different portal into MIT-quality education. Through MITx, MIT educational content can reach, augment, and enrich the education and livelihood of many learners who cannot attend -MIT.

    +MIT.

    -

    MITx does not provide a full MIT education. Our residential +

    MITx does not provide a full MIT education. Our residential campus is the heart of MIT’s knowledge creation and -dissemination. MIT students enjoy a comprehensive curriculum and -distinct educational environment. Without MIT, there would be no -MITx.

    +dissemination. MIT students enjoy a comprehensive curriculum and +distinct educational environment. Without MIT, there would be no +MITx.

    -

    Advancing the public good. MITx is an opportunity to help -preserve and expand higher education as a public good. Historically, +

    Advancing the public good. MITx is an opportunity to help +preserve and expand higher education as a public good. Historically, the investment of public and private assets in enormous amounts has produced the public benefits of knowledge creation and dissemination, leading to capable citizens, innovation, job creation, economic @@ -96,7 +96,7 @@ education to migrate online, MIT sees the opportunity to democratize education with unprecedented efficiency and scalability. We possess a strong desire and feel a compelling obligation to offer a not-for-profit, mission-driven, open-technology approach to online -learning. MITx is our contribution.

    +learning. MITx is our contribution.

    From b2b05fdd93943dd57f68d35323502c3bca7a4441 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Fri, 10 Feb 2012 16:45:26 -0500 Subject: [PATCH 18/46] Date change again --- mitx_global.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/mitx_global.html b/mitx_global.html index ee89e655f8..cda5656331 100644 --- a/mitx_global.html +++ b/mitx_global.html @@ -43,7 +43,7 @@ More information & Enroll

    -

    Taught by Anant Agarwal, with Gerald Sussman and Piotr Mitros, 6.002x (Circuits and Electronics) is an on-line adaption of 6.002, MIT’s first undergraduate analog design course. This prototype course will run, free of charge, for students worldwide from March 1, 2012 through June 8, 2012. Students will be given the opportunity to demonstrate their mastery of the material and earn a certificate from MITx.

    +

    Taught by Anant Agarwal, with Gerald Sussman and Piotr Mitros, 6.002x (Circuits and Electronics) is an on-line adaption of 6.002, MIT’s first undergraduate analog design course. This prototype course will run, free of charge, for students worldwide from March 5, 2012 through June 8, 2012. Students will be given the opportunity to demonstrate their mastery of the material and earn a certificate from MITx.

    From 97f124f7bd374375d710a47905e0451372cc3028 Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Fri, 10 Feb 2012 19:12:17 -0500 Subject: [PATCH 19/46] Blocks to get rid of login buttons, TOS tweak --- 6002x-faq.html | 3 +++ 6002x-press-release.html | 3 +++ marketing.html | 2 ++ mitx-overview.html | 2 ++ tos.html | 5 +++-- 5 files changed, 13 insertions(+), 2 deletions(-) diff --git a/6002x-faq.html b/6002x-faq.html index 832f8df02a..fe49474bdf 100644 --- a/6002x-faq.html +++ b/6002x-faq.html @@ -1,4 +1,7 @@ <%inherit file="marketing.html" /> +<%block name="login_area"> + +
    diff --git a/6002x-press-release.html b/6002x-press-release.html index 05f44a300f..c5ead707e8 100644 --- a/6002x-press-release.html +++ b/6002x-press-release.html @@ -1,4 +1,7 @@ <%inherit file="marketing.html" /> +<%block name="login_area"> + +
    diff --git a/marketing.html b/marketing.html index 84e5b50666..f34150fcf0 100644 --- a/marketing.html +++ b/marketing.html @@ -68,7 +68,9 @@ function postJSON(url, data, callback) { diff --git a/mitx-overview.html b/mitx-overview.html index d278faf0c1..6279d88a05 100644 --- a/mitx-overview.html +++ b/mitx-overview.html @@ -1,4 +1,6 @@ <%inherit file="marketing.html" /> +<%block name="login_area"> +
    diff --git a/tos.html b/tos.html index a815ba8b1b..42bab7a235 100644 --- a/tos.html +++ b/tos.html @@ -215,7 +215,8 @@ risk. Your access to or download of information, materials, or data through the Site or any reference sites is at your own discretion and risk and that you will be solely responsible for any damage to your property (including your computer system) or loss of data that results -from the download or use of such material or data.

    +from the download or use of such material or data. We may close or +limit enrollment for pedagogical or technological reasons.

    User Postings Disclaimer. You understand that when using the Site you will be exposed to User Postings from a variety of @@ -301,6 +302,6 @@ consent to the personal jurisdiction of and exclusive venue in the federal and state courts located in and serving Boston, Massachusetts as the legal forum for any such dispute.

    -

    Effective Date: February 6, 2012

    +

    Effective Date: February 10, 2012

    From f4f37a94ea08cffd15587c86282808a9758bc22d Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Sun, 12 Feb 2012 09:34:42 -0500 Subject: [PATCH 20/46] Updated honor code --- create_account.html | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/create_account.html b/create_account.html index 0b15a323e2..aeda133287 100644 --- a/create_account.html +++ b/create_account.html @@ -1,7 +1,7 @@
    -

    Enroll in 6.002 Circuits & Electronics

    +

    Enroll in 6.002x Circuits & Electronics

    <% if 'error' in locals(): e = error %> @@ -27,8 +27,8 @@
  • - - + +
    If you would like us to give you a certificate of completion at the end, we need your full legal name, as you would like it to appear on the certificate (e.g. "John Smith, Jr").
    • @@ -49,16 +49,17 @@
  • - +
  • + I agree to the Honor Code, summarized as:*
      +
    • Complete all mid-terms and final exams with only my own work.
      • +
    • Maintain only one account, and not share the username or password.
    • Not engage in any activities that would dishonestly improve my results, or improve or hurt those of others.
      • -
    • Never post answers to problems.
      • -
    • Maintain only one account.
      • +
    • Never post answers to problems that are being used to assess student performance.
    • From 25d4d2a760eb589832dd979a3a0d60823c5e9691 Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Sun, 12 Feb 2012 09:35:51 -0500 Subject: [PATCH 21/46] Updated honor code --- create_account.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/create_account.html b/create_account.html index aeda133287..93541eac17 100644 --- a/create_account.html +++ b/create_account.html @@ -59,7 +59,7 @@
  • Complete all mid-terms and final exams with only my own work.
  • Maintain only one account, and not share the username or password.
  • Not engage in any activities that would dishonestly improve my results, or improve or hurt those of others.
    • -
  • Never post answers to problems that are being used to assess student performance.
    • +
  • Not post answers to problems that are being used to assess student performance.
    • From 812e137cf340befab2e449a31a85d15e81c503e8 Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Sun, 12 Feb 2012 11:17:50 -0500 Subject: [PATCH 22/46] More wordsmithing --- create_account.html | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/create_account.html b/create_account.html index 93541eac17..990ff2b8f9 100644 --- a/create_account.html +++ b/create_account.html @@ -11,26 +11,26 @@
  • - +
  • - +
    Nickname you'd like to use on forums.
  • - + -
    If you would like us to give you a certificate of completion at the end, we need your full legal name, as you would like it to appear on the certificate (e.g. "John Smith, Jr").
    +
    If you successfully complete the course, you will receive an electronic certificate of accomplishment from MITx with this name on it.
  • @@ -49,12 +49,12 @@
  • - +
  • + I agree to the Honor Code, summarized as:*
    • Complete all mid-terms and final exams with only my own work.
    • Maintain only one account, and not share the username or password.
      • From fd086c1c63a27f5f6d7966a98efade581c269528 Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Sun, 12 Feb 2012 20:25:37 -0500 Subject: [PATCH 23/46] Minor wordsmithing, etc. --- 6002x-faq.html | 30 +++++++++++++++--------------- 6002x-press-release.html | 24 ++++++++++++------------ mitx-overview.html | 40 ++++++++++++++++++++-------------------- mitx_global.html | 2 +- 4 files changed, 48 insertions(+), 48 deletions(-) diff --git a/6002x-faq.html b/6002x-faq.html index fe49474bdf..2cbe5ade4a 100644 --- a/6002x-faq.html +++ b/6002x-faq.html @@ -9,39 +9,39 @@ More about 6.002x -

      Answering common questions about the first course on MITx, the +

      Answering common questions about the first course on MITx, the Institute’s online-learning initiative.

      This set of questions and answers accompanies MIT’s February 13, -2012, announcement regarding MITx’s prototype course — +2012, announcement regarding MITx’s prototype course — 6.002x: Circuits and Electronics.

      -What is MITx? MIT seeks through the development of MITx to improve +What is MITx? MIT seeks through the development of MITx to improve education both on the MIT campus and around the world.

      -

      On campus, MITx will be coupled with an Institute-wide research +

      On campus, MITx will be coupled with an Institute-wide research initiative on online teaching and learning. The online learning tools -that MITx develops will benefit the educational experience of +that MITx develops will benefit the educational experience of residential students by supplementing and reinforcing the classroom and laboratory experiences.

      -Beyond the MIT campus, MITx will endeavor to break down barriers to +Beyond the MIT campus, MITx will endeavor to break down barriers to education in two ways. First, it will offer the online teaching of MIT courses to people around the world and the opportunity for able learners to gain certification of mastery of MIT material. Second, it will make freely available to educational institutions everywhere the -open-source software infrastructure on which MITx courses are based. +open-source software infrastructure on which MITx courses are based.

      Since it launched OpenCourseWare 10 years ago, MIT has been committed to using technology to improve and greatly widen access to -education. The launch of MITx represents a next step forward in that +education. The launch of MITx represents a next step forward in that effort.

      @@ -55,7 +55,7 @@ At MIT, each course is assigned a number. All courses in the Department of Electrical Engineering and Computer Science (EECS) start with the number 6, and 6.002 (also known as Circuits and Electronics) is one of the introductory courses for EECS -undergraduates. MITx’s 6.002x is modeled on the on-campus +undergraduates. MITx’s 6.002x is modeled on the on-campus version of 6.002.

      @@ -95,7 +95,7 @@ Do I need to follow a set timeline in completing 6.002x?

      -In this pilot course of MITx, learners seeking a certificate will have +In this pilot course of MITx, learners seeking a certificate will have weekly deadlines for homework and labs. Similarly, the midterm and final exam will be given within a specific range of days. However, faster-paced learners can proceed multiple weeks ahead if they choose. @@ -162,7 +162,7 @@ prototype wiki and discussion forum. Are there prerequisites to take the course?

      -While MITx courses are open to all, there are some skills required to +While MITx courses are open to all, there are some skills required to succeed in taking the course.

      @@ -184,7 +184,7 @@ math backgrounds. How much does the course cost?

      -All of the courses on MITx will be free of charge. Those who have the +All of the courses on MITx will be free of charge. Those who have the ability and motivation to demonstrate mastery of content can receive a credential for a modest fee. For this prototype course, the fee for a credential will be waived. @@ -196,8 +196,8 @@ What is a credential?

      Any learner who successfully completes 6.002x will receive an electronic certificate indicating a grade. This certificate will -indicate that you earned it from MITx’s pilot course. In this -prototype version, MITx will not require that you be tested in a +indicate that you earned it from MITx’s pilot course. In this +prototype version, MITx will not require that you be tested in a testing center or otherwise have your identity certified in order to receive this certificate.

      @@ -206,7 +206,7 @@ receive this certificate. Who is grading the course?

      -MITx courses will use automated technologies to check student work +MITx courses will use automated technologies to check student work including practice exercises, homework assignments, labs and exams.

      diff --git a/6002x-press-release.html b/6002x-press-release.html index c5ead707e8..8cb394db99 100644 --- a/6002x-press-release.html +++ b/6002x-press-release.html @@ -5,7 +5,7 @@
      -

      MITx prototype course opens for enrollment—Online-learning +

      MITx prototype course opens for enrollment—Online-learning initiative’s first offering, ‘6.002x: Circuits and Electronics,’ accepting registrants now.

      @@ -13,7 +13,7 @@ Electronics,’ accepting registrants now.

      In December, MIT announced the -launch of an online learning initiative called “MITx.” +launch of an online learning initiative called “MITx.” Starting this week, interested learners can now enroll for free in the initiative”s prototype course -- 6.002x: Circuits and Electronics.

      @@ -28,14 +28,14 @@ Engineering and Computer Science (EECS) — 6.002x will introduce engineering in the context of the lumped circuit abstraction, helping students make the transition from physics to the fields of electrical engineering and computer science. It will be taught by Anant Agarwal, -EECS professor and director of MIT”s Computer Science and +EECS professor and director of MIT's Computer Science and Artificial Intelligence Laboratory (CSAIL); Chris Terman, CSAIL co-director; EECS Professor Gerald Sussman; and CSAIL Research Scientist Piotr Mitros.

      - “We are very excited to begin MITx with this prototype + “We are very excited to begin MITx with this prototype class,” says MIT Provost L. Rafael Reif. “We will use this prototype course to optimize the tools we have built by soliciting and acting on feedback from learners.” @@ -56,7 +56,7 @@ each week on the course.

      -“We invite you to join us for this pilot course of MITx,” +“We invite you to join us for this pilot course of MITx,” Agarwal says. “The 6.002x team of professors and teaching assistants is excited to work with you on the discussion forum, and we look forward to your feedback to improve the learning @@ -71,15 +71,15 @@ about 6.002x can be found here.

      -FAQs about MITx as a whole can be found here. +FAQs about MITx as a whole can be found here.

      At the end of the prototype course, students who demonstrate their mastery will be able to receive a certificate of completion for -free. In future MITx courses, students who complete the mastery -requirement on MITx will be able to receive the credential for a +free. In future MITx courses, students who complete the mastery +requirement on MITx will be able to receive the credential for a modest fee.

      @@ -112,19 +112,19 @@ http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html

      -MITx website +MITx website

      http://mitx.mit.edu -

      +

      diff --git a/mitx-overview.html b/mitx-overview.html index 6279d88a05..c0de06e281 100644 --- a/mitx-overview.html +++ b/mitx-overview.html @@ -4,12 +4,12 @@
      -

      MITx Advances MIT’s Vision for Online Learning

      +

      MITx Advances MIT’s Vision for Online Learning

      Education has entered an era of rapid, exciting, technology-enabled change. At MIT, we welcome the opportunity to harness the power of on-line technology for our students and for the -world. On December 19, 2011, we announced MITx, an initiative to +world. On December 19, 2011, we announced MITx, an initiative to offer exciting, challenging and enriching courses to anyone, anywhere, who has the motivation and ability to engage MIT’s educational content.

      @@ -18,12 +18,12 @@ educational content.

      launched OpenCourseWare, which places online the course materials for substantially the entire MIT curriculum, and was the genesis of today’s worldwide -movement in free, open educational resources. MITx is the next step +movement in free, open educational resources. MITx is the next step in opening MIT’s educational doors to the world. Through OCW and -MITx, MIT invites the world to join it in the passion, hard work and +MITx, MIT invites the world to join it in the passion, hard work and thrill of learning and discovery.

      -

      MITx will e-publish interactive online courses that:

      +

      MITx will e-publish interactive online courses that:

      • Empower students to learn at their own pace;
        • @@ -33,10 +33,10 @@ thrill of learning and discovery.

      • Assess individual student learning as the student progresses through the course.
      -

      MITx students who demonstrate their mastery of a subject can earn -a certificate of completion awarded by MITx.

      +

      MITx students who demonstrate their mastery of a subject can earn +a certificate of completion awarded by MITx.

      -

      MITx courses will be available to the world through an Internet +

      MITx courses will be available to the world through an Internet platform that MIT will make freely available. MIT hopes that other educational institutions, anywhere in the world, will adapt and use the platform to publish their own educational content online for the @@ -44,7 +44,7 @@ benefit of learners. Because the platform will be open-source and scalable, adopters and users can continuously improve it, for the benefit of everyone.

      -

      Why Is MIT Creating MITx?

      +

      Why Is MIT Creating MITx?

      Excellence in teaching and learning. MIT must always provide its students the very best teaching and learning tools possible. MIT @@ -59,34 +59,34 @@ faculty members, confirmed MIT’s conviction that digital technologies enrich learning. Many other innovative institutions and enterprises believe the same and are bringing creative online offerings forward. Having brain-stormed, investigated and studied, -we were ready to act and eager to start. We announced our MITx +we were ready to act and eager to start. We announced our MITx aspiration to capture and encourage the energy of our faculty in creating new online teaching and learning tools.

      -

      Once up and running, MITx will be a laboratory for online -learning. Whether MITx learners are MIT’s on-campus students, -university students elsewhere, or independent learners, MITx will help +

      Once up and running, MITx will be a laboratory for online +learning. Whether MITx learners are MIT’s on-campus students, +university students elsewhere, or independent learners, MITx will help us understand how online learning occurs and how virtual communities of learners assemble -- information that in turn will allow us to -improve both MITx and our on-campus teaching.

      +improve both MITx and our on-campus teaching.

      -

      Access to higher education. MITx will help shatter barriers to +

      Access to higher education. MITx will help shatter barriers to education. The constraints of MIT’s physical campus allow us to admit less than 10 percent of our undergraduate applicants. We teach on-campus only a tiny fraction of the people in the world with the ability and motivation to learn MIT content. Online technology provides a new and different portal into MIT-quality education. -Through MITx, MIT educational content can reach, augment, and enrich +Through MITx, MIT educational content can reach, augment, and enrich the education and livelihood of many learners who cannot attend MIT.

      -

      MITx does not provide a full MIT education. Our residential +

      MITx does not provide a full MIT education. Our residential campus is the heart of MIT’s knowledge creation and dissemination. MIT students enjoy a comprehensive curriculum and distinct educational environment. Without MIT, there would be no -MITx.

      +MITx.

      -

      Advancing the public good. MITx is an opportunity to help +

      Advancing the public good. MITx is an opportunity to help preserve and expand higher education as a public good. Historically, the investment of public and private assets in enormous amounts has produced the public benefits of knowledge creation and dissemination, @@ -98,7 +98,7 @@ education to migrate online, MIT sees the opportunity to democratize education with unprecedented efficiency and scalability. We possess a strong desire and feel a compelling obligation to offer a not-for-profit, mission-driven, open-technology approach to online -learning. MITx is our contribution.

      +learning. MITx is our contribution.

      diff --git a/mitx_global.html b/mitx_global.html index e592e4077d..4da2cf7ab5 100644 --- a/mitx_global.html +++ b/mitx_global.html @@ -27,7 +27,7 @@
    • operates on an open-source, scalable software infrastructure in order to make it continuously improving and readily available to other educational institutions, such as universities and K-12 school systems.
    -

    Press & links: 6.002x Press Release, 6.002x FAQ, MITx overview, Boston Globe, New York Times, MIT Press Release, MITx FAQ,

    +

    Press & links: 6.002x Press Release, 6.002x FAQ, MITx overview, Boston Globe, New York Times, MIT Press Release, MITx FAQ

    • From 5835fd6eeb0fa95384044b2dda37e3e211f2673b Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Mon, 13 Feb 2012 00:43:08 -0500 Subject: [PATCH 24/46] MITx italics --- create_account.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/create_account.html b/create_account.html index 990ff2b8f9..e50c26d748 100644 --- a/create_account.html +++ b/create_account.html @@ -30,7 +30,7 @@ -
    If you successfully complete the course, you will receive an electronic certificate of accomplishment from MITx with this name on it.
    +
    If you successfully complete the course, you will receive an electronic certificate of accomplishment from MITx with this name on it.
  • From fdcb58489a51ff76ecd76d8f61be04920980579d Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Mon, 13 Feb 2012 12:17:35 -0500 Subject: [PATCH 25/46] Added link to homepage and course page on acctivation --- activation_complete.html | 1 + sass/_index-extends.scss | 2 ++ 2 files changed, 3 insertions(+) diff --git a/activation_complete.html b/activation_complete.html index c74af930d5..0e13733778 100644 --- a/activation_complete.html +++ b/activation_complete.html @@ -5,4 +5,5 @@

    Activation Complete!

    Thanks for activating your email. We will notify you as soon as the course starts.

    +

    For now you can got to the MITx homepage or the 6.002x course page.

    diff --git a/sass/_index-extends.scss b/sass/_index-extends.scss index 2d3f911633..f3e79430d8 100644 --- a/sass/_index-extends.scss +++ b/sass/_index-extends.scss @@ -20,6 +20,7 @@ p { margin-bottom: lh(); + line-height: lh(); } h1 { @@ -37,6 +38,7 @@ li { list-style: disc outside none; + line-height: lh(); } } } From 1366afcfc135e816c6bbf70755dd1f5726eb5572 Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Mon, 13 Feb 2012 13:52:23 -0500 Subject: [PATCH 26/46] Minor bug fixes --- 6002x-faq.html | 5 +++-- 6002x-press-release.html | 2 +- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/6002x-faq.html b/6002x-faq.html index 2cbe5ade4a..c33cb5e966 100644 --- a/6002x-faq.html +++ b/6002x-faq.html @@ -19,9 +19,10 @@ This set of questions and answers accompanies MIT’s February 13,

    -What is MITx? MIT seeks through the development of MITx to improve +What is MITx?

    + +

    MIT seeks through the development of MITx to improve education both on the MIT campus and around the world. -

    On campus, MITx will be coupled with an Institute-wide research initiative on online teaching and learning. The online learning tools diff --git a/6002x-press-release.html b/6002x-press-release.html index 8cb394db99..439c234edd 100644 --- a/6002x-press-release.html +++ b/6002x-press-release.html @@ -70,7 +70,7 @@ be found here.

    about 6.002x can be found here.

    - + FAQs about MITx as a whole can be found here.

    From 89fbab77f7708482ab41b848f9c037fe70a21ee9 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Mon, 13 Feb 2012 14:01:52 -0500 Subject: [PATCH 27/46] Fixed links and added them to other pages --- activation_active.html | 1 + activation_complete.html | 2 +- activation_invalid.html | 2 ++ sass/_index.scss | 7 ------- 4 files changed, 4 insertions(+), 8 deletions(-) diff --git a/activation_active.html b/activation_active.html index 5b5e42478f..2861784cff 100644 --- a/activation_active.html +++ b/activation_active.html @@ -6,4 +6,5 @@

    This account has already been activated. We will notify you as soon as the course starts.

    +

    For now you can go to the MITx homepage or the 6.002x course page.

    diff --git a/activation_complete.html b/activation_complete.html index 0e13733778..ff988da1c6 100644 --- a/activation_complete.html +++ b/activation_complete.html @@ -5,5 +5,5 @@

    Activation Complete!

    Thanks for activating your email. We will notify you as soon as the course starts.

    -

    For now you can got to the MITx homepage or the 6.002x course page.

    +

    For now you can go to the MITx homepage or the 6.002x course page.

    diff --git a/activation_invalid.html b/activation_invalid.html index 583c5d9a90..f8afc8233b 100644 --- a/activation_invalid.html +++ b/activation_invalid.html @@ -6,4 +6,6 @@ correct -- e-mail programs will sometimes split it into two lines. If you still have issues, e-mail us to let us know what happened at bugs@mitx.mit.edu.

    + +

    Or you can go back to the 6.002x course page.

    diff --git a/sass/_index.scss b/sass/_index.scss index d579eb8ea6..0c7360f015 100644 --- a/sass/_index.scss +++ b/sass/_index.scss @@ -53,13 +53,6 @@ header.announcement { &.home { background: #e3e3e3 url("/static/images/marketing/shot-5-medium.jpg"); - @media screen and (min-width: 1200px) { - background: #e3e3e3 url("/static/images/marketing/shot-5-large.jpg"); - } - - // @media screen and (max-width: 1199px) { - // } - div { padding: lh(10) lh() lh(3); From 0c83d18761cf20f8a67c582031cf3b2848cb88f3 Mon Sep 17 00:00:00 2001 From: Ernie Park Date: Mon, 13 Feb 2012 14:55:28 -0500 Subject: [PATCH 28/46] switch intro video to (experimental) iframe player so closing overlay stops video, and hitting play autoplays video. still buggy if clicked within 1 second of loading page --HG-- branch : templates-ernie-global-intro-video --- mitx_global.html | 26 +++++++++++++++++++++++--- 1 file changed, 23 insertions(+), 3 deletions(-) diff --git a/mitx_global.html b/mitx_global.html index ee89e655f8..70fa2b7145 100644 --- a/mitx_global.html +++ b/mitx_global.html @@ -12,7 +12,7 @@
    - Watch intro video + Watch intro video
    @@ -48,12 +48,32 @@
    - +
    From b30dc6fed69ff42fa0e40944166fb2af1d5e87a2 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Mon, 13 Feb 2012 15:09:57 -0500 Subject: [PATCH 29/46] Hide footer links for activation pages --- activation_active.html | 2 ++ activation_complete.html | 1 + activation_invalid.html | 2 ++ index.html | 2 ++ main.html | 2 +- sass/_activation.scss | 15 ++++++++ sass/_layout.scss | 78 ++++++++++++++++++++++------------------ 7 files changed, 66 insertions(+), 36 deletions(-) diff --git a/activation_active.html b/activation_active.html index 2861784cff..e28d0f1205 100644 --- a/activation_active.html +++ b/activation_active.html @@ -1,6 +1,8 @@ <%inherit file="main.html" /> +<%block name="bodyclass">activation +

    Account already active!

    diff --git a/activation_complete.html b/activation_complete.html index ff988da1c6..04878c118e 100644 --- a/activation_complete.html +++ b/activation_complete.html @@ -1,6 +1,7 @@ <%inherit file="main.html" /> +<%block name="bodyclass">activation

    Activation Complete!

    diff --git a/activation_invalid.html b/activation_invalid.html index f8afc8233b..f327fbaa67 100644 --- a/activation_invalid.html +++ b/activation_invalid.html @@ -1,4 +1,6 @@ <%inherit file="main.html" /> +<%block name="body-class">activation +

    Activation Invalid

    diff --git a/index.html b/index.html index ff32f6a336..a8e716d3f9 100644 --- a/index.html +++ b/index.html @@ -1,5 +1,7 @@ <%inherit file="marketing.html" /> +<%block name="body-class">activation + <%block name="header_text">
    diff --git a/main.html b/main.html index 05d00112f5..96f2a32cd4 100644 --- a/main.html +++ b/main.html @@ -38,7 +38,7 @@ - +"> ${self.body()} <%block name="bodyextra"/> diff --git a/sass/_activation.scss b/sass/_activation.scss index 0ec5ea837a..8ae293200e 100644 --- a/sass/_activation.scss +++ b/sass/_activation.scss @@ -1,3 +1,18 @@ +body.activation { + footer { + max-width: 600px; + text-align: center; + + p { + float: none; + } + + ul { + display: none; + } + } +} + section.activation { @extend .wrapper; @include box-shadow(0 1px 0 #fff); diff --git a/sass/_layout.scss b/sass/_layout.scss index 6984531ff9..e124f0f62f 100644 --- a/sass/_layout.scss +++ b/sass/_layout.scss @@ -133,49 +133,57 @@ html { 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; + footer { + @extend .clearfix; + @extend .wrapper; + @include box-sizing(border-box); + color: #777; + margin-top: $body-line-height; + padding: 0 $body-line-height; - p { - float: left; - - a { - color: #444; - - &:link, &:visited { - color: #444; - } - - &:hover, &:focus { - color: #000; - } - } - } - - ul { - float: right; - - li { - display: inline-block; - margin-right: 20px; + p { + float: left; a { color: #444; - &:link, &:visited { - color: #444; - } + &:link, &:visited { + color: #444; + } - &:hover, &:focus { - color: #000; + &:hover, &:focus { + color: #000; + } } + } + + ul { + float: right; + + li { + display: inline-block; + margin-right: 20px; + + a { + color: #444; + + &:link, &:visited { + color: #444; + } + + &:hover, &:focus { + color: #000; + } + } + } + } + } + + &.activation { + footer { + ul { + display: none; } } } From 2db960a2b3c993a717baf431367da8df0d8184ee Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Mon, 13 Feb 2012 15:26:55 -0500 Subject: [PATCH 30/46] unused css class --- index.html | 2 -- 1 file changed, 2 deletions(-) diff --git a/index.html b/index.html index a8e716d3f9..ff32f6a336 100644 --- a/index.html +++ b/index.html @@ -1,7 +1,5 @@ <%inherit file="marketing.html" /> -<%block name="body-class">activation - <%block name="header_text">
    From 0b424b4bd8024aee53cc46671c191fa60a7a3905 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Mon, 13 Feb 2012 15:40:02 -0500 Subject: [PATCH 31/46] Fixed errorn on invalid activation --- activation_invalid.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/activation_invalid.html b/activation_invalid.html index f327fbaa67..d2e7086592 100644 --- a/activation_invalid.html +++ b/activation_invalid.html @@ -1,5 +1,5 @@ <%inherit file="main.html" /> -<%block name="body-class">activation +<%block name="bodyclass">activation

    Activation Invalid

    From 06d241c5144464a6c33f02b6b6eef806c0022f6d Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Mon, 13 Feb 2012 15:57:31 -0500 Subject: [PATCH 32/46] Standard forms for templates --- activation_active.html | 7 ++++--- activation_complete.html | 8 ++++---- activation_invalid.html | 7 ++++--- 3 files changed, 12 insertions(+), 10 deletions(-) diff --git a/activation_active.html b/activation_active.html index e28d0f1205..5f2af64c21 100644 --- a/activation_active.html +++ b/activation_active.html @@ -1,7 +1,7 @@ +<%inherit file="marketing.html" /> -<%inherit file="main.html" /> - -<%block name="bodyclass">activation +
    +

    Account already active!

    @@ -9,4 +9,5 @@

    This account has already been activated. We will notify you as soon as the course starts.

    For now you can go to the MITx homepage or the 6.002x course page.

    +
    diff --git a/activation_complete.html b/activation_complete.html index 04878c118e..f976f00239 100644 --- a/activation_complete.html +++ b/activation_complete.html @@ -1,10 +1,10 @@ +<%inherit file="marketing.html" /> -<%inherit file="main.html" /> - -<%block name="bodyclass">activation -
    +
    +

    Activation Complete!

    Thanks for activating your email. We will notify you as soon as the course starts.

    For now you can go to the MITx homepage or the 6.002x course page.

    +
    diff --git a/activation_invalid.html b/activation_invalid.html index d2e7086592..419f7a0ae6 100644 --- a/activation_invalid.html +++ b/activation_invalid.html @@ -1,7 +1,7 @@ -<%inherit file="main.html" /> -<%block name="bodyclass">activation +<%inherit file="marketing.html" /> -
    +
    +

    Activation Invalid

    Something went wrong. Check to make sure the URL you went to was @@ -10,4 +10,5 @@ at bugs@mitx.mit.edu.

    Or you can go back to the 6.002x course page.

    +
    From 4cd5720abaa379307076d0ba9b46c089ea77212a Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Mon, 13 Feb 2012 16:16:25 -0500 Subject: [PATCH 33/46] Removed obsolete error code -- now AJAX --- login.html | 2 -- 1 file changed, 2 deletions(-) diff --git a/login.html b/login.html index 798817047a..abf59aae74 100644 --- a/login.html +++ b/login.html @@ -1,6 +1,4 @@ -${ error } -

    Log in to MITx

    From 872b2af4c94ee13b0b903ab7df2fe8ac05948881 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Mon, 13 Feb 2012 16:32:15 -0500 Subject: [PATCH 34/46] Added help page for outside the app, link to help in footer and Opencourseware link --- marketing.html | 1 + mitx_global.html | 2 +- mitx_help.html | 24 ++++++++++++++++++++++++ sass/_index-extends.scss | 8 ++++++++ 4 files changed, 34 insertions(+), 1 deletion(-) create mode 100644 mitx_help.html diff --git a/marketing.html b/marketing.html index f34150fcf0..9f59ef88f0 100644 --- a/marketing.html +++ b/marketing.html @@ -96,6 +96,7 @@ function postJSON(url, data, callback) {
  • Terms of Service
  • Privacy Policy
  • Honor Code
    • +
  • Help
    • diff --git a/mitx_global.html b/mitx_global.html index 6c8449da81..3cc3b302e7 100644 --- a/mitx_global.html +++ b/mitx_global.html @@ -27,7 +27,7 @@
  • operates on an open-source, scalable software infrastructure in order to make it continuously improving and readily available to other educational institutions, such as universities and K-12 school systems.
    • -

    Press & links: 6.002x Press Release, 6.002x FAQ, MITx overview, Boston Globe, New York Times, MIT Press Release, MITx FAQ

    +

    Press & links: 6.002x Press Release, 6.002x FAQ, MITx overview, Boston Globe, New York Times, MIT Press Release, MITx FAQ, OpenCourseWare

    diff --git a/mitx_help.html b/mitx_help.html new file mode 100644 index 0000000000..e67fd1255d --- /dev/null +++ b/mitx_help.html @@ -0,0 +1,24 @@ +<%inherit file="marketing.html" /> + +
    +
    +
    +

    Help & Feedback

    +

    If run into any problems, we have several e-mail addresses set up:

    +
    +
    System-related questions
    +
    technical@mitx.mit.edu
    +
    Content-related questions
    +
    content@mitx.mit.edu
    +
    Bug reports
    +
    bugs@mitx.mit.edu
    +
    Suggestions
    +
    suggestions@mitx.mit.edu
    +
    + +

    Please bear in mind that while we read them, we do not expect to + have time to respond to all e-mails.

    +
    +
    +
    + diff --git a/sass/_index-extends.scss b/sass/_index-extends.scss index f3e79430d8..47f16352ad 100644 --- a/sass/_index-extends.scss +++ b/sass/_index-extends.scss @@ -41,6 +41,14 @@ line-height: lh(); } } + + dl { + margin-bottom: lh(); + + dd { + margin-bottom: lh(.5); + } + } } } From 31c63455e1a1c70c9c07094f2d62f26e9119a3c1 Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Mon, 13 Feb 2012 16:42:38 -0500 Subject: [PATCH 35/46] Slightly better text --- mitx_help.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/mitx_help.html b/mitx_help.html index e67fd1255d..ab0c28a23e 100644 --- a/mitx_help.html +++ b/mitx_help.html @@ -4,7 +4,8 @@

    Help & Feedback

    -

    If run into any problems, we have several e-mail addresses set up:

    +

    If run into problems signing up for the web site which you + cannot resolve on your own, you can reach us at:

    System-related questions
    technical@mitx.mit.edu
    From 647407ad45a2c25ac5e7b801d2f27fec5aa68ff9 Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Mon, 13 Feb 2012 17:20:33 -0500 Subject: [PATCH 36/46] hg ignore update --- .hgignore | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.hgignore b/.hgignore index c93aa7128d..e2ae8c91cb 100644 --- a/.hgignore +++ b/.hgignore @@ -5,3 +5,5 @@ syntax: glob *.swp *.orig *.DS_Store +#* +.#* \ No newline at end of file From 56858e6498ec855f3b5921e8f710f1f8f24d4ae4 Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Mon, 13 Feb 2012 18:42:13 -0500 Subject: [PATCH 37/46] Undid Kyle's Chrome bug fix, since it resulted in worse Firefox bugs --- sass/_index.scss | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/sass/_index.scss b/sass/_index.scss index 0c7360f015..d579eb8ea6 100644 --- a/sass/_index.scss +++ b/sass/_index.scss @@ -53,6 +53,13 @@ header.announcement { &.home { background: #e3e3e3 url("/static/images/marketing/shot-5-medium.jpg"); + @media screen and (min-width: 1200px) { + background: #e3e3e3 url("/static/images/marketing/shot-5-large.jpg"); + } + + // @media screen and (max-width: 1199px) { + // } + div { padding: lh(10) lh() lh(3); From 3176123c7c2d1a34798c07f6a3fd3d033c7c75dc Mon Sep 17 00:00:00 2001 From: Reda Lemeden Date: Mon, 13 Feb 2012 18:52:00 -0500 Subject: [PATCH 38/46] Started redesigning the question filtering and navigation --- sass/_askbot-original.scss | 20 ++--- sass/_discussion-questions.scss | 129 +++++++++++++++++++++++--------- sass/_discussion.scss | 88 +++------------------- sass/_question-view.scss | 1 + 4 files changed, 114 insertions(+), 124 deletions(-) diff --git a/sass/_askbot-original.scss b/sass/_askbot-original.scss index a1ff71cb0e..811be0496c 100644 --- a/sass/_askbot-original.scss +++ b/sass/_askbot-original.scss @@ -650,17 +650,17 @@ body.anon #searchBar { // padding-top: 6px; // font-family: 'Yanone Kaffeesatz',sans-serif; } -#listSearchTags { - float: left; - margin-top: 3px; - color: #707070; - font-size: 16px; - font-family: 'Yanone Kaffeesatz',sans-serif; } +// #listSearchTags { +// float: left; +// margin-top: 3px; +// color: #707070; +// font-size: 16px; +// font-family: 'Yanone Kaffeesatz',sans-serif; } -ul#searchTags { - margin-left: 10px; - float: right; - padding-top: 2px; } +// ul#searchTags { +// margin-left: 10px; +// float: right; +// padding-top: 2px; } // .search-tips { // font-size: 16px; diff --git a/sass/_discussion-questions.scss b/sass/_discussion-questions.scss index a776c316d4..eb0d0aedf3 100644 --- a/sass/_discussion-questions.scss +++ b/sass/_discussion-questions.scss @@ -1,55 +1,112 @@ -div.question-controls { +div.question-list-header { display: block; - margin-bottom: 30px; + margin-bottom: 15px; overflow: hidden; width: flex-grid(9,9); - div { - display: inline-block; - } + section.question-list-meta, section.question-sort-filter { + display: block; + overflow: hidden; + width: 100%; - div.question-count { - margin-right: flex-gutter(); - width: flex-grid(4,9); - - h1 { - margin-top: 0; + div { + display: inline; + float: left; } } - div.question-sort { - vertical-align: bottom; - width: flex-grid(5,9); + section.question-list-meta { + div.question-list-title { + margin-right: flex-gutter(); + // width: flex-grid(3,9); - nav { - @include border-radius(35px); - background-color: lighten(#F6EFD4, 5%) ; - height: 30px; - float: right; - font-size: 16px; - margin: 3px 0; - padding:0px 20px 5px; + h1 { + margin-top: 0; + } + } - a { - color: darken(#F6EFD4, 50%); + div.question-list-tags { + // width: flex-grid(6,9); + padding-top:8px; - &.on span{ - font-weight: bold; - } + ul.tags { + display: inline; + // float: left; - &:before { - content: '|'; - color: darken(#F6EFD4, 10%); - font-size: 22px; - } + li { + span.delete-icon, div.delete-icon { + @include border-radius(0 4px 4px 0); + background: #555; + color: #eee; + cursor: pointer; + float: none; + left: 10px; + padding: 3px 6px; + position: relative; + top: 1px; + opacity: 0.5; - &:hover { - text-decoration: none; - color: darken(#F6EFD4, 70%); + &:hover { + opacity: 1; + } + } } } } } + section.question-sort-filter { + font-size: 16px; + + span.label { + color: #555; + } + + div.question-filter { + margin-right: flex-gutter(9); + + ul.scope-filters { + @extend .action-link; + + li { + display: inline; + + a { + &.on { + font-weight: bold; + } + + &:before { + content: '|'; + color: darken(#F6EFD4, 10%); + font-size: 22px; + } + } + } + } + } + + div.question-sort { + margin-left: flex-gutter(); + float: right; + + nav { + @extend .action-link; + + a { + &.on span{ + font-weight: bold; + } + + &:before { + content: '|'; + color: darken(#F6EFD4, 10%); + font-size: 22px; + } + } + } + } + } + } ul.question-list { @@ -75,7 +132,7 @@ ul.question-list { h2 { font-size: 16px; - font-weight: normal; + font-weight: bold; margin: 0px 0 15px 0; text-transform: none; } diff --git a/sass/_discussion.scss b/sass/_discussion.scss index 58250f9b73..111d23bff0 100644 --- a/sass/_discussion.scss +++ b/sass/_discussion.scss @@ -17,73 +17,19 @@ text-decoration: none; } } +.action-link { + a { + color: darken(#F6EFD4, 50%); + + &:hover { + text-decoration: none; + color: darken(#F6EFD4, 70%); + } + } +} // Layout body.askbot { - .secondary-nav { - margin: 0; - - nav { - @extend .clearfix; - @extend .topbar; - @extend .wrapper; - @include box-sizing(border-box); - border: 1px solid darken(#F6EFD4, 10%); - border-top: 0; - margin: 0 auto; - padding: $body-line-height; - - div { - float: left; - - &.question-filter { - font-size:16px; - margin-top: 4px; - width: flex-grid(4); - - ul { - @include border-radius(35px); - background: darken(#F6EFD4, 20%); - display: inline; - margin: 0 0 0 10px; - padding: $body-line-height/4 20px; - - li { - display: inline-block; - list-style: none; - margin-right: 10px; - - &:last-child { - margin-right: 0; - } - - a { - text-transform: capitalize; - text-shadow: none; - font-size: 14px; - - &.on { - font-weight: bold; - } - } - } - } - } - - &.search-box { - margin-left:2%; - text-align:right; - width: flex-grid(8); - - input[type="text"] { - margin-right: 6px; - width: flex-grid(2,8); - } - } - - } - } - } section.main-content { div.discussion-wrapper { @@ -149,18 +95,4 @@ body.askbot { } } - // footer { - // margin: 0 auto; - // padding: 0; - - // div.footer-wrapper { - // @extend .clearfix; - // @extend .wrapper; - // @include box-shadow(0 1px 0 #fff); - // @include box-sizing(border-box); - // background-color: #000; - // border-top: 0; - // padding: $gw-gutter/2; - // } - // } } diff --git a/sass/_question-view.scss b/sass/_question-view.scss index 1fae85f023..090551b052 100644 --- a/sass/_question-view.scss +++ b/sass/_question-view.scss @@ -93,6 +93,7 @@ div.question-header { float: left; margin-right: flex-gutter(8); width: flex-grid(6.2,8); + } div.post-update-container { From e3e1a37bc27d0876e0a0b204eef22df98a1ebe7c Mon Sep 17 00:00:00 2001 From: Piotr Mitros Date: Mon, 13 Feb 2012 20:24:08 -0500 Subject: [PATCH 39/46] Missed commit for custom tags --- custom_tags | 1 + 1 file changed, 1 insertion(+) create mode 120000 custom_tags diff --git a/custom_tags b/custom_tags new file mode 120000 index 0000000000..ec1dac8fbe --- /dev/null +++ b/custom_tags @@ -0,0 +1 @@ +../data/custom_tags \ No newline at end of file From 48650b131b97634ad621bbfb0deb9dc30f3e1383 Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Tue, 14 Feb 2012 11:31:23 -0500 Subject: [PATCH 40/46] Changed amazon link --- index.html | 2 +- sass/_index.scss | 3 --- 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/index.html b/index.html index ff32f6a336..3cbb0bf84d 100644 --- a/index.html +++ b/index.html @@ -31,7 +31,7 @@

    If you successfully complete the course, you will receive an electronic certificate of accomplishment from MITx. This certificate will indicate that you earned it from MITx’s pilot course. In this prototype version, MITx will not require that you be tested in a testing center or otherwise have your identity certified in order to receive this certificate.

    -

    The course uses the textbook Foundations of Analog and Digital Electronic Circuits, by Anant Agarwal and Jeffrey H. Lang. Morgan Kaufmann Publishers, Elsevier, July 2005. While recommended, the book is not required: relevant sections will be provided electronically as part of the online course for personal use in connection with this course only. The copyright for the book is owned by Elsevier. The book can be purchased on Amazon.

    +

    The course uses the textbook Foundations of Analog and Digital Electronic Circuits, by Anant Agarwal and Jeffrey H. Lang. Morgan Kaufmann Publishers, Elsevier, July 2005. While recommended, the book is not required: relevant sections will be provided electronically as part of the online course for personal use in connection with this course only. The copyright for the book is owned by Elsevier. The book can be purchased on Amazon.

    diff --git a/sass/_index.scss b/sass/_index.scss index d579eb8ea6..163c46305e 100644 --- a/sass/_index.scss +++ b/sass/_index.scss @@ -57,9 +57,6 @@ header.announcement { background: #e3e3e3 url("/static/images/marketing/shot-5-large.jpg"); } - // @media screen and (max-width: 1199px) { - // } - div { padding: lh(10) lh() lh(3); From 7e0d9b0d4349a148ff784a163ebbf62f5e8d0edc Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Tue, 14 Feb 2012 11:40:23 -0500 Subject: [PATCH 41/46] Update bourbon --HG-- branch : kf-refactor-scss --- bourbon/_bourbon.scss | 29 ++ bourbon/addons/_button.scss | 267 ++++++++++++++++++ bourbon/addons/_font-family.scss | 5 + bourbon/addons/_html5-input-types.scss | 36 +++ bourbon/addons/_position.scss | 30 ++ bourbon/addons/_timing-functions.scss | 32 +++ bourbon/css3/_animation.scss | 171 +++++++++++ bourbon/css3/_appearance.scss | 7 + bourbon/css3/_background-image.scss | 71 +++++ bourbon/css3/_background-size.scss | 15 + bourbon/css3/_border-image.scss | 7 + bourbon/css3/_border-radius.scss | 59 ++++ bourbon/css3/_box-shadow.scss | 16 ++ bourbon/css3/_box-sizing.scss | 8 + bourbon/css3/_columns.scss | 67 +++++ bourbon/css3/_flex-box.scss | 67 +++++ bourbon/css3/_inline-block.scss | 10 + bourbon/css3/_linear-gradient.scss | 41 +++ bourbon/css3/_radial-gradient.scss | 22 ++ bourbon/css3/_transform.scss | 19 ++ bourbon/css3/_transition.scss | 104 +++++++ .../_deprecated-webkit-gradient.scss | 36 +++ bourbon/functions/_grid-width.scss | 13 + bourbon/functions/_linear-gradient.scss | 23 ++ bourbon/functions/_modular-scale.scss | 40 +++ bourbon/functions/_radial-gradient.scss | 15 + bourbon/functions/_tint-shade.scss | 9 + bourbon/lib/bourbon.rb | 19 ++ bourbon/lib/bourbon/sass_extensions.rb | 6 + .../lib/bourbon/sass_extensions/functions.rb | 13 + .../sass_extensions/functions/compact.rb | 13 + sass/application.scss | 1 - 32 files changed, 1270 insertions(+), 1 deletion(-) create mode 100644 bourbon/_bourbon.scss create mode 100644 bourbon/addons/_button.scss create mode 100644 bourbon/addons/_font-family.scss create mode 100644 bourbon/addons/_html5-input-types.scss create mode 100644 bourbon/addons/_position.scss create mode 100644 bourbon/addons/_timing-functions.scss create mode 100644 bourbon/css3/_animation.scss create mode 100644 bourbon/css3/_appearance.scss create mode 100644 bourbon/css3/_background-image.scss create mode 100644 bourbon/css3/_background-size.scss create mode 100644 bourbon/css3/_border-image.scss create mode 100644 bourbon/css3/_border-radius.scss create mode 100644 bourbon/css3/_box-shadow.scss create mode 100644 bourbon/css3/_box-sizing.scss create mode 100644 bourbon/css3/_columns.scss create mode 100644 bourbon/css3/_flex-box.scss create mode 100644 bourbon/css3/_inline-block.scss create mode 100644 bourbon/css3/_linear-gradient.scss create mode 100644 bourbon/css3/_radial-gradient.scss create mode 100644 bourbon/css3/_transform.scss create mode 100644 bourbon/css3/_transition.scss create mode 100644 bourbon/functions/_deprecated-webkit-gradient.scss create mode 100644 bourbon/functions/_grid-width.scss create mode 100644 bourbon/functions/_linear-gradient.scss create mode 100644 bourbon/functions/_modular-scale.scss create mode 100644 bourbon/functions/_radial-gradient.scss create mode 100644 bourbon/functions/_tint-shade.scss create mode 100644 bourbon/lib/bourbon.rb create mode 100644 bourbon/lib/bourbon/sass_extensions.rb create mode 100644 bourbon/lib/bourbon/sass_extensions/functions.rb create mode 100644 bourbon/lib/bourbon/sass_extensions/functions/compact.rb diff --git a/bourbon/_bourbon.scss b/bourbon/_bourbon.scss new file mode 100644 index 0000000000..447167c5ab --- /dev/null +++ b/bourbon/_bourbon.scss @@ -0,0 +1,29 @@ +// Custom Functions +@import "functions/deprecated-webkit-gradient"; +@import "functions/grid-width"; +@import "functions/modular-scale"; +@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"; diff --git a/bourbon/addons/_button.scss b/bourbon/addons/_button.scss new file mode 100644 index 0000000000..1d32125140 --- /dev/null +++ b/bourbon/addons/_button.scss @@ -0,0 +1,267 @@ +@mixin button ($style: simple, $base-color: #4294f0) { + + @if type-of($style) == color { + $base-color: $style; + $style: simple; + } + + // Grayscale button + @if $base-color == grayscale($base-color) { + @if $style == simple { + @include simple($base-color, $grayscale: true); + } + + @else if $style == shiny { + @include shiny($base-color, $grayscale: true); + } + + @else if $style == pill { + @include pill($base-color, $grayscale: true); + } + } + + // Colored button + @else { + @if $style == simple { + @include simple($base-color); + } + + @else if $style == shiny { + @include shiny($base-color); + } + + @else if $style == pill { + @include pill($base-color); + } + } +} + + +// Simple Button +//************************************************************************// +@mixin simple($base-color, $grayscale: false) { + $color: hsl(0, 0, 100%); + $border: adjust-color($base-color, $saturation: 9%, $lightness: -14%); + $inset-shadow: adjust-color($base-color, $saturation: -8%, $lightness: 15%); + $stop-gradient: adjust-color($base-color, $saturation: 9%, $lightness: -11%); + $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%); + } + + @if $grayscale == true { + $border: grayscale($border); + $inset-shadow: grayscale($inset-shadow); + $stop-gradient: grayscale($stop-gradient); + $text-shadow: grayscale($text-shadow); + } + + 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%); + $inset-shadow-hover: adjust-color($base-color, $saturation: -7%, $lightness: 5%); + $stop-gradient-hover: adjust-color($base-color, $saturation: 8%, $lightness: -14%); + + @if $grayscale == true { + $base-color-hover: grayscale($base-color-hover); + $inset-shadow-hover: grayscale($inset-shadow-hover); + $stop-gradient-hover: grayscale($stop-gradient-hover); + } + + @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%); + + @if $grayscale == true { + $border-active: grayscale($border-active); + $inset-shadow-active: grayscale($inset-shadow-active); + } + + 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); + } +} + + +// Shiny Button +//************************************************************************// +@mixin shiny($base-color, $grayscale: false) { + $color: hsl(0, 0, 100%); + $border: adjust-color($base-color, $red: -117, $green: -111, $blue: -81); + $border-bottom: adjust-color($base-color, $red: -126, $green: -127, $blue: -122); + $fourth-stop: adjust-color($base-color, $red: -79, $green: -70, $blue: -46); + $inset-shadow: adjust-color($base-color, $red: 37, $green: 29, $blue: 12); + $second-stop: adjust-color($base-color, $red: -56, $green: -50, $blue: -33); + $text-shadow: adjust-color($base-color, $red: -140, $green: -141, $blue: -114); + $third-stop: adjust-color($base-color, $red: -86, $green: -75, $blue: -48); + + @if lightness($base-color) > 70% { + $color: hsl(0, 0, 20%); + $text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%); + } + + @if $grayscale == true { + $border: grayscale($border); + $border-bottom: grayscale($border-bottom); + $fourth-stop: grayscale($fourth-stop); + $inset-shadow: grayscale($inset-shadow); + $second-stop: grayscale($second-stop); + $text-shadow: grayscale($text-shadow); + $third-stop: grayscale($third-stop); + } + + 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; + @include linear-gradient(top, $base-color 0%, $second-stop 50%, $third-stop 50%, $fourth-stop 100%); + padding: 7px 20px 8px; + text-align: center; + text-decoration: none; + 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); + + @if $grayscale == true { + $first-stop-hover: grayscale($first-stop-hover); + $second-stop-hover: grayscale($second-stop-hover); + $third-stop-hover: grayscale($third-stop-hover); + $fourth-stop-hover: grayscale($fourth-stop-hover); + } + + cursor: pointer; + @include linear-gradient(top, $first-stop-hover 0%, + $second-stop-hover 50%, + $third-stop-hover 50%, + $fourth-stop-hover 100%); + } + + &:active { + $inset-shadow-active: adjust-color($base-color, $red: -111, $green: -116, $blue: -122); + + @if $grayscale == true { + $inset-shadow-active: grayscale($inset-shadow-active); + } + + @include box-shadow(inset 0 0 20px 0 $inset-shadow-active, 0 1px 0 #fff); + } +} + + +// Pill Button +//************************************************************************// +@mixin pill($base-color, $grayscale: false) { + $color: hsl(0, 0, 100%); + $border-bottom: adjust-color($base-color, $hue: 8, $saturation: -11%, $lightness: -26%); + $border-sides: adjust-color($base-color, $hue: 4, $saturation: -21%, $lightness: -21%); + $border-top: adjust-color($base-color, $hue: -1, $saturation: -30%, $lightness: -15%); + $inset-shadow: adjust-color($base-color, $hue: -1, $saturation: -1%, $lightness: 7%); + $stop-gradient: adjust-color($base-color, $hue: 8, $saturation: 14%, $lightness: -10%); + $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%); + } + + @if $grayscale == true { + $border-bottom: grayscale($border-bottom); + $border-sides: grayscale($border-sides); + $border-top: grayscale($border-top); + $inset-shadow: grayscale($inset-shadow); + $stop-gradient: grayscale($stop-gradient); + $text-shadow: grayscale($text-shadow); + } + + 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; + @include linear-gradient ($base-color, $stop-gradient); + 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%); + $border-bottom: adjust-color($base-color, $hue: 8, $saturation: 13.5%, $lightness: -32%); + $border-sides: adjust-color($base-color, $hue: 4, $saturation: -2%, $lightness: -27%); + $border-top: adjust-color($base-color, $hue: -1, $saturation: -17%, $lightness: -21%); + $inset-shadow-hover: adjust-color($base-color, $saturation: -1%, $lightness: 3%); + $stop-gradient-hover: adjust-color($base-color, $hue: 8, $saturation: -4%, $lightness: -15.5%); + $text-shadow-hover: adjust-color($base-color, $hue: 5, $saturation: -5%, $lightness: -22%); + + @if $grayscale == true { + $base-color-hover: grayscale($base-color-hover); + $border-bottom: grayscale($border-bottom); + $border-sides: grayscale($border-sides); + $border-top: grayscale($border-top); + $inset-shadow-hover: grayscale($inset-shadow-hover); + $stop-gradient-hover: grayscale($stop-gradient-hover); + $text-shadow-hover: grayscale($text-shadow-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; + @include linear-gradient ($base-color-hover, $stop-gradient-hover); + 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%); + + @if $grayscale == true { + $active-color: grayscale($active-color); + $border-active: grayscale($border-active); + $border-bottom-active: grayscale($border-bottom-active); + $inset-shadow-active: grayscale($inset-shadow-active); + $text-shadow-active: grayscale($text-shadow-active); + } + + 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; + } +} + diff --git a/bourbon/addons/_font-family.scss b/bourbon/addons/_font-family.scss new file mode 100644 index 0000000000..df8a80ddfc --- /dev/null +++ b/bourbon/addons/_font-family.scss @@ -0,0 +1,5 @@ +$georgia: Georgia, Cambria, "Times New Roman", Times, serif; +$helvetica: "Helvetica Neue", Helvetica, Arial, sans-serif; +$lucida-grande: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif; +$monospace: "Bitstream Vera Sans Mono", Consolas, Courier, monospace; +$verdana: Verdana, Geneva, sans-serif; diff --git a/bourbon/addons/_html5-input-types.scss b/bourbon/addons/_html5-input-types.scss new file mode 100644 index 0000000000..9d86fbb4d4 --- /dev/null +++ b/bourbon/addons/_html5-input-types.scss @@ -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; +// } diff --git a/bourbon/addons/_position.scss b/bourbon/addons/_position.scss new file mode 100644 index 0000000000..6ad330f1df --- /dev/null +++ b/bourbon/addons/_position.scss @@ -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; + } +} diff --git a/bourbon/addons/_timing-functions.scss b/bourbon/addons/_timing-functions.scss new file mode 100644 index 0000000000..51b2410914 --- /dev/null +++ b/bourbon/addons/_timing-functions.scss @@ -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); diff --git a/bourbon/css3/_animation.scss b/bourbon/css3/_animation.scss new file mode 100644 index 0000000000..f99e06eb6f --- /dev/null +++ b/bourbon/css3/_animation.scss @@ -0,0 +1,171 @@ +// http://www.w3.org/TR/css3-animations/#the-animation-name-property- +// Each of these mixins support comma separated lists of values, which allows different transitions for individual properties to be described in a single style rule. Each value in the list corresponds to the value at that same position in the other properties. + +// Official animation shorthand property. +@mixin animation ($animation-1, + $animation-2: false, $animation-3: false, + $animation-4: false, $animation-5: false, + $animation-6: false, $animation-7: false, + $animation-8: false, $animation-9: false) + { + $full: compact($animation-1, $animation-2, $animation-3, $animation-4, + $animation-5, $animation-6, $animation-7, $animation-8, $animation-9); + + -webkit-animation: $full; + -moz-animation: $full; + animation: $full; +} + +// Individual Animation Properties +@mixin animation-name ($name-1, + $name-2: false, $name-3: false, + $name-4: false, $name-5: false, + $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 | + $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; +} + + +// Deprecated +@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); + } + @warn "The animation-basic mixin is deprecated. Use the animation mixin instead."; +} + diff --git a/bourbon/css3/_appearance.scss b/bourbon/css3/_appearance.scss new file mode 100644 index 0000000000..548767e166 --- /dev/null +++ b/bourbon/css3/_appearance.scss @@ -0,0 +1,7 @@ +@mixin appearance ($value) { + -webkit-appearance: $value; + -moz-appearance: $value; + -ms-appearance: $value; + -o-appearance: $value; + appearance: $value; +} diff --git a/bourbon/css3/_background-image.scss b/bourbon/css3/_background-image.scss new file mode 100644 index 0000000000..b11ab3fd53 --- /dev/null +++ b/bourbon/css3/_background-image.scss @@ -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); diff --git a/bourbon/css3/_background-size.scss b/bourbon/css3/_background-size.scss new file mode 100644 index 0000000000..4bba11027d --- /dev/null +++ b/bourbon/css3/_background-size.scss @@ -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; +} diff --git a/bourbon/css3/_border-image.scss b/bourbon/css3/_border-image.scss new file mode 100644 index 0000000000..0373980422 --- /dev/null +++ b/bourbon/css3/_border-image.scss @@ -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; +} diff --git a/bourbon/css3/_border-radius.scss b/bourbon/css3/_border-radius.scss new file mode 100644 index 0000000000..f950d4dd98 --- /dev/null +++ b/bourbon/css3/_border-radius.scss @@ -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); +} diff --git a/bourbon/css3/_box-shadow.scss b/bourbon/css3/_box-shadow.scss new file mode 100644 index 0000000000..ad5c24e7aa --- /dev/null +++ b/bourbon/css3/_box-shadow.scss @@ -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; +} diff --git a/bourbon/css3/_box-sizing.scss b/bourbon/css3/_box-sizing.scss new file mode 100644 index 0000000000..a9c6cdb43f --- /dev/null +++ b/bourbon/css3/_box-sizing.scss @@ -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; +} diff --git a/bourbon/css3/_columns.scss b/bourbon/css3/_columns.scss new file mode 100644 index 0000000000..2896c91d7f --- /dev/null +++ b/bourbon/css3/_columns.scss @@ -0,0 +1,67 @@ +@mixin columns($arg: auto) { +// || + -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) { +// || || + -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; +} diff --git a/bourbon/css3/_flex-box.scss b/bourbon/css3/_flex-box.scss new file mode 100644 index 0000000000..44c1dfd789 --- /dev/null +++ b/bourbon/css3/_flex-box.scss @@ -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; +} diff --git a/bourbon/css3/_inline-block.scss b/bourbon/css3/_inline-block.scss new file mode 100644 index 0000000000..d79a13c851 --- /dev/null +++ b/bourbon/css3/_inline-block.scss @@ -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; +} diff --git a/bourbon/css3/_linear-gradient.scss b/bourbon/css3/_linear-gradient.scss new file mode 100644 index 0000000000..0b68501719 --- /dev/null +++ b/bourbon/css3/_linear-gradient.scss @@ -0,0 +1,41 @@ +@mixin linear-gradient($pos, $G1, $G2: false, + $G3: false, $G4: false, + $G5: false, $G6: false, + $G7: false, $G8: false, + $G9: false, $G10: false, + $fallback: 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); + + // Set $G1 as the default fallback color + $fallback-color: nth($G1, 1); + + // If $fallback is a color use that color as the fallback color + @if type-of($fallback) == color { + $fallback-color: $fallback; + } + + background-color: $fallback-color; + background-image: deprecated-webkit-gradient(linear, $full); // Safari <= 5.0 + background-image: -webkit-linear-gradient($pos, $full); // Safari 5.1+, Chrome + background-image: -moz-linear-gradient($pos, $full); + 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(#1e5799, #2989d8, $fallback:#2989d8); +// @include linear-gradient(top, #1e5799 0%, #2989d8 50%); +// @include linear-gradient(50deg, rgba(10, 10, 10, 0.5) 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%); diff --git a/bourbon/css3/_radial-gradient.scss b/bourbon/css3/_radial-gradient.scss new file mode 100644 index 0000000000..fbd0a8523c --- /dev/null +++ b/bourbon/css3/_radial-gradient.scss @@ -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); diff --git a/bourbon/css3/_transform.scss b/bourbon/css3/_transform.scss new file mode 100644 index 0000000000..8d19e8b88d --- /dev/null +++ b/bourbon/css3/_transform.scss @@ -0,0 +1,19 @@ +@mixin transform($property: none) { +// none | + -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; +} diff --git a/bourbon/css3/_transition.scss b/bourbon/css3/_transition.scss new file mode 100644 index 0000000000..058dbe0e33 --- /dev/null +++ b/bourbon/css3/_transition.scss @@ -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; +} + diff --git a/bourbon/functions/_deprecated-webkit-gradient.scss b/bourbon/functions/_deprecated-webkit-gradient.scss new file mode 100644 index 0000000000..1322f6f60e --- /dev/null +++ b/bourbon/functions/_deprecated-webkit-gradient.scss @@ -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; +} diff --git a/bourbon/functions/_grid-width.scss b/bourbon/functions/_grid-width.scss new file mode 100644 index 0000000000..8e63d83d60 --- /dev/null +++ b/bourbon/functions/_grid-width.scss @@ -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; +// } diff --git a/bourbon/functions/_linear-gradient.scss b/bourbon/functions/_linear-gradient.scss new file mode 100644 index 0000000000..3b10ca82a6 --- /dev/null +++ b/bourbon/functions/_linear-gradient.scss @@ -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; +} + diff --git a/bourbon/functions/_modular-scale.scss b/bourbon/functions/_modular-scale.scss new file mode 100644 index 0000000000..dddccb5224 --- /dev/null +++ b/bourbon/functions/_modular-scale.scss @@ -0,0 +1,40 @@ +@function modular-scale($value, $increment, $ratio) { + @if $increment > 0 { + @for $i from 1 through $increment { + $value: ($value * $ratio); + } + } + + @if $increment < 0 { + $increment: abs($increment); + @for $i from 1 through $increment { + $value: ($value / $ratio); + } + } + + @return $value; +} + +// div { +// Increment Up GR with positive value +// font-size: modular-scale(14px, 1, 1.618); // returns: 22.652px +// +// Increment Down GR with negative value +// font-size: modular-scale(14px, -1, 1.618); // returns: 8.653px +// +// Can be used with ceil(round up) or floor(round down) +// font-size: floor( modular-scale(14px, 1, 1.618) ); // returns: 22px +// font-size: ceil( modular-scale(14px, 1, 1.618) ); // returns: 23px +// } +// +// modularscale.com + +@function golden-ratio($value, $increment) { + @return modular-scale($value, $increment, 1.618) +} + +// div { +// font-size: golden-ratio(14px, 1); // returns: 22.652px +// } +// +// goldenratiocalculator.com diff --git a/bourbon/functions/_radial-gradient.scss b/bourbon/functions/_radial-gradient.scss new file mode 100644 index 0000000000..3d5461ad6e --- /dev/null +++ b/bourbon/functions/_radial-gradient.scss @@ -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; +} + diff --git a/bourbon/functions/_tint-shade.scss b/bourbon/functions/_tint-shade.scss new file mode 100644 index 0000000000..f7172004ac --- /dev/null +++ b/bourbon/functions/_tint-shade.scss @@ -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); +} diff --git a/bourbon/lib/bourbon.rb b/bourbon/lib/bourbon.rb new file mode 100644 index 0000000000..1635be836d --- /dev/null +++ b/bourbon/lib/bourbon.rb @@ -0,0 +1,19 @@ +require "bourbon/generator" + +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") diff --git a/bourbon/lib/bourbon/sass_extensions.rb b/bourbon/lib/bourbon/sass_extensions.rb new file mode 100644 index 0000000000..ad567200e3 --- /dev/null +++ b/bourbon/lib/bourbon/sass_extensions.rb @@ -0,0 +1,6 @@ +module Bourbon::SassExtensions +end + +require "sass" + +require File.join(File.dirname(__FILE__), "/sass_extensions/functions") diff --git a/bourbon/lib/bourbon/sass_extensions/functions.rb b/bourbon/lib/bourbon/sass_extensions/functions.rb new file mode 100644 index 0000000000..daa877650e --- /dev/null +++ b/bourbon/lib/bourbon/sass_extensions/functions.rb @@ -0,0 +1,13 @@ +module Bourbon::SassExtensions::Functions +end + +require File.join(File.dirname(__FILE__), "/functions/compact") + +module Sass::Script::Functions + include Bourbon::SassExtensions::Functions::Compact +end + +# Wierd that this has to be re-included to pick up sub-modules. Ruby bug? +class Sass::Script::Functions::EvaluationContext + include Sass::Script::Functions +end diff --git a/bourbon/lib/bourbon/sass_extensions/functions/compact.rb b/bourbon/lib/bourbon/sass_extensions/functions/compact.rb new file mode 100644 index 0000000000..5192e921e7 --- /dev/null +++ b/bourbon/lib/bourbon/sass_extensions/functions/compact.rb @@ -0,0 +1,13 @@ +# Compact function pulled from compass +module Bourbon::SassExtensions::Functions::Compact + + def compact(*args) + sep = :comma + if args.size == 1 && args.first.is_a?(Sass::Script::List) + args = args.first.value + sep = args.first.separator + end + Sass::Script::List.new(args.reject{|a| !a.to_bool}, sep) + end + +end diff --git a/sass/application.scss b/sass/application.scss index a32d8b3172..63b6ce1d20 100644 --- a/sass/application.scss +++ b/sass/application.scss @@ -13,7 +13,6 @@ @import "info"; @import "profile"; @import "wiki-basic-html", "wiki-create", "wiki"; -@import "activation"; @import "help"; @import "askbot-original", "discussion", "discussion-questions", "discussion-tags", "question-view" , "discussion-answers", "discussion-forms", "form-wmd-toolbar"; From d6b96ae1f1c777cca56949557ecbeb6f2293759b Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Tue, 14 Feb 2012 13:55:06 -0500 Subject: [PATCH 42/46] Major refactor of scss --HG-- branch : kf-refactor-scss --- bourbon/_bourbon.scss | 29 - bourbon/addons/_button.scss | 267 -------- bourbon/addons/_font-family.scss | 5 - bourbon/addons/_html5-input-types.scss | 36 -- bourbon/addons/_position.scss | 30 - bourbon/addons/_timing-functions.scss | 32 - bourbon/css3/_animation.scss | 171 ------ bourbon/css3/_appearance.scss | 7 - bourbon/css3/_background-image.scss | 71 --- bourbon/css3/_background-size.scss | 15 - bourbon/css3/_border-image.scss | 7 - bourbon/css3/_border-radius.scss | 59 -- bourbon/css3/_box-shadow.scss | 16 - bourbon/css3/_box-sizing.scss | 8 - bourbon/css3/_columns.scss | 67 --- bourbon/css3/_flex-box.scss | 67 --- bourbon/css3/_inline-block.scss | 10 - bourbon/css3/_linear-gradient.scss | 41 -- bourbon/css3/_radial-gradient.scss | 22 - bourbon/css3/_transform.scss | 19 - bourbon/css3/_transition.scss | 104 ---- .../_deprecated-webkit-gradient.scss | 36 -- bourbon/functions/_grid-width.scss | 13 - bourbon/functions/_linear-gradient.scss | 23 - bourbon/functions/_radial-gradient.scss | 15 - bourbon/functions/_tint-shade.scss | 9 - bourbon/lib/bourbon.rb | 19 - bourbon/lib/bourbon/sass_extensions.rb | 6 - .../lib/bourbon/sass_extensions/functions.rb | 13 - .../sass_extensions/functions/compact.rb | 13 - main.html | 1 - sass/_activation.scss | 26 - sass/_base-variables.scss | 53 -- sass/_index.scss | 478 --------------- sass/_jquery-ui-1.8.16.custom.scss | 568 ++++++++++++++++++ sass/_layout.scss | 191 ------ sass/_local.scss | 36 -- sass/_theme.scss | 190 ------ sass/application.scss | 19 +- sass/{ => base}/_base.scss | 5 + .../_extends.scss} | 0 sass/{ => base}/_font-face.scss | 0 .../_functions.scss} | 14 +- sass/{ => base}/_reset.scss | 0 sass/base/_variables.scss | 31 + sass/bourbon/_bourbon.scss | 2 +- sass/bourbon/addons/_button.scss | 207 +++++-- sass/bourbon/addons/_font-family.scss | 1 + sass/bourbon/css3/_animation.scss | 26 +- sass/bourbon/css3/_linear-gradient.scss | 14 +- sass/bourbon/functions/_golden-ratio.scss | 31 - .../bourbon}/functions/_modular-scale.scss | 0 sass/bourbon/lib/bourbon.rb | 2 + sass/{ => courseware}/_courseware.scss | 78 --- .../_sequence-nav.scss} | 0 sass/courseware/_sidebar.scss | 77 +++ .../_video.scss} | 0 .../_answers.scss} | 0 sass/{ => discussion}/_askbot-original.scss | 0 sass/{ => discussion}/_discussion.scss | 0 sass/{ => discussion}/_form-wmd-toolbar.scss | 0 .../_forms.scss} | 0 sass/{ => discussion}/_question-view.scss | 0 .../_questions.scss} | 0 .../_tags.scss} | 0 sass/index/_base.scss | 44 ++ .../_extends.scss} | 0 sass/index/_footer.scss | 47 ++ sass/index/_header.scss | 144 +++++ sass/index/_index.scss | 233 +++++++ .../_variables.scss} | 10 +- sass/layout/_footer.scss | 45 ++ sass/layout/_header.scss | 103 ++++ sass/layout/_layout.scss | 28 + sass/{ => layout}/_leanmodal.scss | 0 sass/marketing.scss | 7 +- sass/print.scss | 6 + .../_basic-html.scss} | 0 sass/{_wiki-create.scss => wiki/_create.scss} | 0 sass/wiki/_sidebar.scss | 69 +++ sass/{ => wiki}/_wiki.scss | 70 --- 81 files changed, 1610 insertions(+), 2476 deletions(-) delete mode 100644 bourbon/_bourbon.scss delete mode 100644 bourbon/addons/_button.scss delete mode 100644 bourbon/addons/_font-family.scss delete mode 100644 bourbon/addons/_html5-input-types.scss delete mode 100644 bourbon/addons/_position.scss delete mode 100644 bourbon/addons/_timing-functions.scss delete mode 100644 bourbon/css3/_animation.scss delete mode 100644 bourbon/css3/_appearance.scss delete mode 100644 bourbon/css3/_background-image.scss delete mode 100644 bourbon/css3/_background-size.scss delete mode 100644 bourbon/css3/_border-image.scss delete mode 100644 bourbon/css3/_border-radius.scss delete mode 100644 bourbon/css3/_box-shadow.scss delete mode 100644 bourbon/css3/_box-sizing.scss delete mode 100644 bourbon/css3/_columns.scss delete mode 100644 bourbon/css3/_flex-box.scss delete mode 100644 bourbon/css3/_inline-block.scss delete mode 100644 bourbon/css3/_linear-gradient.scss delete mode 100644 bourbon/css3/_radial-gradient.scss delete mode 100644 bourbon/css3/_transform.scss delete mode 100644 bourbon/css3/_transition.scss delete mode 100644 bourbon/functions/_deprecated-webkit-gradient.scss delete mode 100644 bourbon/functions/_grid-width.scss delete mode 100644 bourbon/functions/_linear-gradient.scss delete mode 100644 bourbon/functions/_radial-gradient.scss delete mode 100644 bourbon/functions/_tint-shade.scss delete mode 100644 bourbon/lib/bourbon.rb delete mode 100644 bourbon/lib/bourbon/sass_extensions.rb delete mode 100644 bourbon/lib/bourbon/sass_extensions/functions.rb delete mode 100644 bourbon/lib/bourbon/sass_extensions/functions/compact.rb delete mode 100644 sass/_activation.scss delete mode 100644 sass/_base-variables.scss delete mode 100644 sass/_index.scss create mode 100644 sass/_jquery-ui-1.8.16.custom.scss delete mode 100644 sass/_layout.scss delete mode 100644 sass/_local.scss delete mode 100644 sass/_theme.scss rename sass/{ => base}/_base.scss (95%) rename sass/{_base-extends.scss => base/_extends.scss} (100%) rename sass/{ => base}/_font-face.scss (100%) rename sass/{_index-functions.scss => base/_functions.scss} (76%) rename sass/{ => base}/_reset.scss (100%) create mode 100644 sass/base/_variables.scss delete mode 100644 sass/bourbon/functions/_golden-ratio.scss rename {bourbon => sass/bourbon}/functions/_modular-scale.scss (100%) rename sass/{ => courseware}/_courseware.scss (67%) rename sass/{_courseware-sequence-nav.scss => courseware/_sequence-nav.scss} (100%) create mode 100644 sass/courseware/_sidebar.scss rename sass/{_courseware-video.scss => courseware/_video.scss} (100%) rename sass/{_discussion-answers.scss => discussion/_answers.scss} (100%) rename sass/{ => discussion}/_askbot-original.scss (100%) rename sass/{ => discussion}/_discussion.scss (100%) rename sass/{ => discussion}/_form-wmd-toolbar.scss (100%) rename sass/{_discussion-forms.scss => discussion/_forms.scss} (100%) rename sass/{ => discussion}/_question-view.scss (100%) rename sass/{_discussion-questions.scss => discussion/_questions.scss} (100%) rename sass/{_discussion-tags.scss => discussion/_tags.scss} (100%) create mode 100644 sass/index/_base.scss rename sass/{_index-extends.scss => index/_extends.scss} (100%) create mode 100644 sass/index/_footer.scss create mode 100644 sass/index/_header.scss create mode 100644 sass/index/_index.scss rename sass/{_index-variables.scss => index/_variables.scss} (69%) create mode 100644 sass/layout/_footer.scss create mode 100644 sass/layout/_header.scss create mode 100644 sass/layout/_layout.scss rename sass/{ => layout}/_leanmodal.scss (100%) create mode 100644 sass/print.scss rename sass/{_wiki-basic-html.scss => wiki/_basic-html.scss} (100%) rename sass/{_wiki-create.scss => wiki/_create.scss} (100%) create mode 100644 sass/wiki/_sidebar.scss rename sass/{ => wiki}/_wiki.scss (53%) diff --git a/bourbon/_bourbon.scss b/bourbon/_bourbon.scss deleted file mode 100644 index 447167c5ab..0000000000 --- a/bourbon/_bourbon.scss +++ /dev/null @@ -1,29 +0,0 @@ -// Custom Functions -@import "functions/deprecated-webkit-gradient"; -@import "functions/grid-width"; -@import "functions/modular-scale"; -@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"; diff --git a/bourbon/addons/_button.scss b/bourbon/addons/_button.scss deleted file mode 100644 index 1d32125140..0000000000 --- a/bourbon/addons/_button.scss +++ /dev/null @@ -1,267 +0,0 @@ -@mixin button ($style: simple, $base-color: #4294f0) { - - @if type-of($style) == color { - $base-color: $style; - $style: simple; - } - - // Grayscale button - @if $base-color == grayscale($base-color) { - @if $style == simple { - @include simple($base-color, $grayscale: true); - } - - @else if $style == shiny { - @include shiny($base-color, $grayscale: true); - } - - @else if $style == pill { - @include pill($base-color, $grayscale: true); - } - } - - // Colored button - @else { - @if $style == simple { - @include simple($base-color); - } - - @else if $style == shiny { - @include shiny($base-color); - } - - @else if $style == pill { - @include pill($base-color); - } - } -} - - -// Simple Button -//************************************************************************// -@mixin simple($base-color, $grayscale: false) { - $color: hsl(0, 0, 100%); - $border: adjust-color($base-color, $saturation: 9%, $lightness: -14%); - $inset-shadow: adjust-color($base-color, $saturation: -8%, $lightness: 15%); - $stop-gradient: adjust-color($base-color, $saturation: 9%, $lightness: -11%); - $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%); - } - - @if $grayscale == true { - $border: grayscale($border); - $inset-shadow: grayscale($inset-shadow); - $stop-gradient: grayscale($stop-gradient); - $text-shadow: grayscale($text-shadow); - } - - 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%); - $inset-shadow-hover: adjust-color($base-color, $saturation: -7%, $lightness: 5%); - $stop-gradient-hover: adjust-color($base-color, $saturation: 8%, $lightness: -14%); - - @if $grayscale == true { - $base-color-hover: grayscale($base-color-hover); - $inset-shadow-hover: grayscale($inset-shadow-hover); - $stop-gradient-hover: grayscale($stop-gradient-hover); - } - - @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%); - - @if $grayscale == true { - $border-active: grayscale($border-active); - $inset-shadow-active: grayscale($inset-shadow-active); - } - - 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); - } -} - - -// Shiny Button -//************************************************************************// -@mixin shiny($base-color, $grayscale: false) { - $color: hsl(0, 0, 100%); - $border: adjust-color($base-color, $red: -117, $green: -111, $blue: -81); - $border-bottom: adjust-color($base-color, $red: -126, $green: -127, $blue: -122); - $fourth-stop: adjust-color($base-color, $red: -79, $green: -70, $blue: -46); - $inset-shadow: adjust-color($base-color, $red: 37, $green: 29, $blue: 12); - $second-stop: adjust-color($base-color, $red: -56, $green: -50, $blue: -33); - $text-shadow: adjust-color($base-color, $red: -140, $green: -141, $blue: -114); - $third-stop: adjust-color($base-color, $red: -86, $green: -75, $blue: -48); - - @if lightness($base-color) > 70% { - $color: hsl(0, 0, 20%); - $text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%); - } - - @if $grayscale == true { - $border: grayscale($border); - $border-bottom: grayscale($border-bottom); - $fourth-stop: grayscale($fourth-stop); - $inset-shadow: grayscale($inset-shadow); - $second-stop: grayscale($second-stop); - $text-shadow: grayscale($text-shadow); - $third-stop: grayscale($third-stop); - } - - 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; - @include linear-gradient(top, $base-color 0%, $second-stop 50%, $third-stop 50%, $fourth-stop 100%); - padding: 7px 20px 8px; - text-align: center; - text-decoration: none; - 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); - - @if $grayscale == true { - $first-stop-hover: grayscale($first-stop-hover); - $second-stop-hover: grayscale($second-stop-hover); - $third-stop-hover: grayscale($third-stop-hover); - $fourth-stop-hover: grayscale($fourth-stop-hover); - } - - cursor: pointer; - @include linear-gradient(top, $first-stop-hover 0%, - $second-stop-hover 50%, - $third-stop-hover 50%, - $fourth-stop-hover 100%); - } - - &:active { - $inset-shadow-active: adjust-color($base-color, $red: -111, $green: -116, $blue: -122); - - @if $grayscale == true { - $inset-shadow-active: grayscale($inset-shadow-active); - } - - @include box-shadow(inset 0 0 20px 0 $inset-shadow-active, 0 1px 0 #fff); - } -} - - -// Pill Button -//************************************************************************// -@mixin pill($base-color, $grayscale: false) { - $color: hsl(0, 0, 100%); - $border-bottom: adjust-color($base-color, $hue: 8, $saturation: -11%, $lightness: -26%); - $border-sides: adjust-color($base-color, $hue: 4, $saturation: -21%, $lightness: -21%); - $border-top: adjust-color($base-color, $hue: -1, $saturation: -30%, $lightness: -15%); - $inset-shadow: adjust-color($base-color, $hue: -1, $saturation: -1%, $lightness: 7%); - $stop-gradient: adjust-color($base-color, $hue: 8, $saturation: 14%, $lightness: -10%); - $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%); - } - - @if $grayscale == true { - $border-bottom: grayscale($border-bottom); - $border-sides: grayscale($border-sides); - $border-top: grayscale($border-top); - $inset-shadow: grayscale($inset-shadow); - $stop-gradient: grayscale($stop-gradient); - $text-shadow: grayscale($text-shadow); - } - - 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; - @include linear-gradient ($base-color, $stop-gradient); - 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%); - $border-bottom: adjust-color($base-color, $hue: 8, $saturation: 13.5%, $lightness: -32%); - $border-sides: adjust-color($base-color, $hue: 4, $saturation: -2%, $lightness: -27%); - $border-top: adjust-color($base-color, $hue: -1, $saturation: -17%, $lightness: -21%); - $inset-shadow-hover: adjust-color($base-color, $saturation: -1%, $lightness: 3%); - $stop-gradient-hover: adjust-color($base-color, $hue: 8, $saturation: -4%, $lightness: -15.5%); - $text-shadow-hover: adjust-color($base-color, $hue: 5, $saturation: -5%, $lightness: -22%); - - @if $grayscale == true { - $base-color-hover: grayscale($base-color-hover); - $border-bottom: grayscale($border-bottom); - $border-sides: grayscale($border-sides); - $border-top: grayscale($border-top); - $inset-shadow-hover: grayscale($inset-shadow-hover); - $stop-gradient-hover: grayscale($stop-gradient-hover); - $text-shadow-hover: grayscale($text-shadow-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; - @include linear-gradient ($base-color-hover, $stop-gradient-hover); - 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%); - - @if $grayscale == true { - $active-color: grayscale($active-color); - $border-active: grayscale($border-active); - $border-bottom-active: grayscale($border-bottom-active); - $inset-shadow-active: grayscale($inset-shadow-active); - $text-shadow-active: grayscale($text-shadow-active); - } - - 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; - } -} - diff --git a/bourbon/addons/_font-family.scss b/bourbon/addons/_font-family.scss deleted file mode 100644 index df8a80ddfc..0000000000 --- a/bourbon/addons/_font-family.scss +++ /dev/null @@ -1,5 +0,0 @@ -$georgia: Georgia, Cambria, "Times New Roman", Times, serif; -$helvetica: "Helvetica Neue", Helvetica, Arial, sans-serif; -$lucida-grande: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif; -$monospace: "Bitstream Vera Sans Mono", Consolas, Courier, monospace; -$verdana: Verdana, Geneva, sans-serif; diff --git a/bourbon/addons/_html5-input-types.scss b/bourbon/addons/_html5-input-types.scss deleted file mode 100644 index 9d86fbb4d4..0000000000 --- a/bourbon/addons/_html5-input-types.scss +++ /dev/null @@ -1,36 +0,0 @@ -//************************************************************************// -// 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; -// } diff --git a/bourbon/addons/_position.scss b/bourbon/addons/_position.scss deleted file mode 100644 index 6ad330f1df..0000000000 --- a/bourbon/addons/_position.scss +++ /dev/null @@ -1,30 +0,0 @@ -@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; - } -} diff --git a/bourbon/addons/_timing-functions.scss b/bourbon/addons/_timing-functions.scss deleted file mode 100644 index 51b2410914..0000000000 --- a/bourbon/addons/_timing-functions.scss +++ /dev/null @@ -1,32 +0,0 @@ -// 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); diff --git a/bourbon/css3/_animation.scss b/bourbon/css3/_animation.scss deleted file mode 100644 index f99e06eb6f..0000000000 --- a/bourbon/css3/_animation.scss +++ /dev/null @@ -1,171 +0,0 @@ -// http://www.w3.org/TR/css3-animations/#the-animation-name-property- -// Each of these mixins support comma separated lists of values, which allows different transitions for individual properties to be described in a single style rule. Each value in the list corresponds to the value at that same position in the other properties. - -// Official animation shorthand property. -@mixin animation ($animation-1, - $animation-2: false, $animation-3: false, - $animation-4: false, $animation-5: false, - $animation-6: false, $animation-7: false, - $animation-8: false, $animation-9: false) - { - $full: compact($animation-1, $animation-2, $animation-3, $animation-4, - $animation-5, $animation-6, $animation-7, $animation-8, $animation-9); - - -webkit-animation: $full; - -moz-animation: $full; - animation: $full; -} - -// Individual Animation Properties -@mixin animation-name ($name-1, - $name-2: false, $name-3: false, - $name-4: false, $name-5: false, - $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 | - $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; -} - - -// Deprecated -@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); - } - @warn "The animation-basic mixin is deprecated. Use the animation mixin instead."; -} - diff --git a/bourbon/css3/_appearance.scss b/bourbon/css3/_appearance.scss deleted file mode 100644 index 548767e166..0000000000 --- a/bourbon/css3/_appearance.scss +++ /dev/null @@ -1,7 +0,0 @@ -@mixin appearance ($value) { - -webkit-appearance: $value; - -moz-appearance: $value; - -ms-appearance: $value; - -o-appearance: $value; - appearance: $value; -} diff --git a/bourbon/css3/_background-image.scss b/bourbon/css3/_background-image.scss deleted file mode 100644 index b11ab3fd53..0000000000 --- a/bourbon/css3/_background-image.scss +++ /dev/null @@ -1,71 +0,0 @@ -//************************************************************************// -// 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); diff --git a/bourbon/css3/_background-size.scss b/bourbon/css3/_background-size.scss deleted file mode 100644 index 4bba11027d..0000000000 --- a/bourbon/css3/_background-size.scss +++ /dev/null @@ -1,15 +0,0 @@ -@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; -} diff --git a/bourbon/css3/_border-image.scss b/bourbon/css3/_border-image.scss deleted file mode 100644 index 0373980422..0000000000 --- a/bourbon/css3/_border-image.scss +++ /dev/null @@ -1,7 +0,0 @@ -@mixin border-image ($image) { - -webkit-border-image: $image; - -moz-border-image: $image; - -ms-border-image: $image; - -o-border-image: $image; - border-image: $image; -} diff --git a/bourbon/css3/_border-radius.scss b/bourbon/css3/_border-radius.scss deleted file mode 100644 index f950d4dd98..0000000000 --- a/bourbon/css3/_border-radius.scss +++ /dev/null @@ -1,59 +0,0 @@ -@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); -} diff --git a/bourbon/css3/_box-shadow.scss b/bourbon/css3/_box-shadow.scss deleted file mode 100644 index ad5c24e7aa..0000000000 --- a/bourbon/css3/_box-shadow.scss +++ /dev/null @@ -1,16 +0,0 @@ -// 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; -} diff --git a/bourbon/css3/_box-sizing.scss b/bourbon/css3/_box-sizing.scss deleted file mode 100644 index a9c6cdb43f..0000000000 --- a/bourbon/css3/_box-sizing.scss +++ /dev/null @@ -1,8 +0,0 @@ -@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; -} diff --git a/bourbon/css3/_columns.scss b/bourbon/css3/_columns.scss deleted file mode 100644 index 2896c91d7f..0000000000 --- a/bourbon/css3/_columns.scss +++ /dev/null @@ -1,67 +0,0 @@ -@mixin columns($arg: auto) { -// || - -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) { -// || || - -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; -} diff --git a/bourbon/css3/_flex-box.scss b/bourbon/css3/_flex-box.scss deleted file mode 100644 index 44c1dfd789..0000000000 --- a/bourbon/css3/_flex-box.scss +++ /dev/null @@ -1,67 +0,0 @@ -// 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; -} diff --git a/bourbon/css3/_inline-block.scss b/bourbon/css3/_inline-block.scss deleted file mode 100644 index d79a13c851..0000000000 --- a/bourbon/css3/_inline-block.scss +++ /dev/null @@ -1,10 +0,0 @@ -// 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; -} diff --git a/bourbon/css3/_linear-gradient.scss b/bourbon/css3/_linear-gradient.scss deleted file mode 100644 index 0b68501719..0000000000 --- a/bourbon/css3/_linear-gradient.scss +++ /dev/null @@ -1,41 +0,0 @@ -@mixin linear-gradient($pos, $G1, $G2: false, - $G3: false, $G4: false, - $G5: false, $G6: false, - $G7: false, $G8: false, - $G9: false, $G10: false, - $fallback: 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); - - // Set $G1 as the default fallback color - $fallback-color: nth($G1, 1); - - // If $fallback is a color use that color as the fallback color - @if type-of($fallback) == color { - $fallback-color: $fallback; - } - - background-color: $fallback-color; - background-image: deprecated-webkit-gradient(linear, $full); // Safari <= 5.0 - background-image: -webkit-linear-gradient($pos, $full); // Safari 5.1+, Chrome - background-image: -moz-linear-gradient($pos, $full); - 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(#1e5799, #2989d8, $fallback:#2989d8); -// @include linear-gradient(top, #1e5799 0%, #2989d8 50%); -// @include linear-gradient(50deg, rgba(10, 10, 10, 0.5) 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%); diff --git a/bourbon/css3/_radial-gradient.scss b/bourbon/css3/_radial-gradient.scss deleted file mode 100644 index fbd0a8523c..0000000000 --- a/bourbon/css3/_radial-gradient.scss +++ /dev/null @@ -1,22 +0,0 @@ -// 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); diff --git a/bourbon/css3/_transform.scss b/bourbon/css3/_transform.scss deleted file mode 100644 index 8d19e8b88d..0000000000 --- a/bourbon/css3/_transform.scss +++ /dev/null @@ -1,19 +0,0 @@ -@mixin transform($property: none) { -// none | - -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; -} diff --git a/bourbon/css3/_transition.scss b/bourbon/css3/_transition.scss deleted file mode 100644 index 058dbe0e33..0000000000 --- a/bourbon/css3/_transition.scss +++ /dev/null @@ -1,104 +0,0 @@ -// 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; -} - diff --git a/bourbon/functions/_deprecated-webkit-gradient.scss b/bourbon/functions/_deprecated-webkit-gradient.scss deleted file mode 100644 index 1322f6f60e..0000000000 --- a/bourbon/functions/_deprecated-webkit-gradient.scss +++ /dev/null @@ -1,36 +0,0 @@ -// 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; -} diff --git a/bourbon/functions/_grid-width.scss b/bourbon/functions/_grid-width.scss deleted file mode 100644 index 8e63d83d60..0000000000 --- a/bourbon/functions/_grid-width.scss +++ /dev/null @@ -1,13 +0,0 @@ -@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; -// } diff --git a/bourbon/functions/_linear-gradient.scss b/bourbon/functions/_linear-gradient.scss deleted file mode 100644 index 3b10ca82a6..0000000000 --- a/bourbon/functions/_linear-gradient.scss +++ /dev/null @@ -1,23 +0,0 @@ -@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; -} - diff --git a/bourbon/functions/_radial-gradient.scss b/bourbon/functions/_radial-gradient.scss deleted file mode 100644 index 3d5461ad6e..0000000000 --- a/bourbon/functions/_radial-gradient.scss +++ /dev/null @@ -1,15 +0,0 @@ -// 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; -} - diff --git a/bourbon/functions/_tint-shade.scss b/bourbon/functions/_tint-shade.scss deleted file mode 100644 index f7172004ac..0000000000 --- a/bourbon/functions/_tint-shade.scss +++ /dev/null @@ -1,9 +0,0 @@ -// 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); -} diff --git a/bourbon/lib/bourbon.rb b/bourbon/lib/bourbon.rb deleted file mode 100644 index 1635be836d..0000000000 --- a/bourbon/lib/bourbon.rb +++ /dev/null @@ -1,19 +0,0 @@ -require "bourbon/generator" - -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") diff --git a/bourbon/lib/bourbon/sass_extensions.rb b/bourbon/lib/bourbon/sass_extensions.rb deleted file mode 100644 index ad567200e3..0000000000 --- a/bourbon/lib/bourbon/sass_extensions.rb +++ /dev/null @@ -1,6 +0,0 @@ -module Bourbon::SassExtensions -end - -require "sass" - -require File.join(File.dirname(__FILE__), "/sass_extensions/functions") diff --git a/bourbon/lib/bourbon/sass_extensions/functions.rb b/bourbon/lib/bourbon/sass_extensions/functions.rb deleted file mode 100644 index daa877650e..0000000000 --- a/bourbon/lib/bourbon/sass_extensions/functions.rb +++ /dev/null @@ -1,13 +0,0 @@ -module Bourbon::SassExtensions::Functions -end - -require File.join(File.dirname(__FILE__), "/functions/compact") - -module Sass::Script::Functions - include Bourbon::SassExtensions::Functions::Compact -end - -# Wierd that this has to be re-included to pick up sub-modules. Ruby bug? -class Sass::Script::Functions::EvaluationContext - include Sass::Script::Functions -end diff --git a/bourbon/lib/bourbon/sass_extensions/functions/compact.rb b/bourbon/lib/bourbon/sass_extensions/functions/compact.rb deleted file mode 100644 index 5192e921e7..0000000000 --- a/bourbon/lib/bourbon/sass_extensions/functions/compact.rb +++ /dev/null @@ -1,13 +0,0 @@ -# Compact function pulled from compass -module Bourbon::SassExtensions::Functions::Compact - - def compact(*args) - sep = :comma - if args.size == 1 && args.first.is_a?(Sass::Script::List) - args = args.first.value - sep = args.first.separator - end - Sass::Script::List.new(args.reject{|a| !a.to_bool}, sep) - end - -end diff --git a/main.html b/main.html index 96f2a32cd4..567f41b1db 100644 --- a/main.html +++ b/main.html @@ -5,7 +5,6 @@ - diff --git a/sass/_activation.scss b/sass/_activation.scss deleted file mode 100644 index 8ae293200e..0000000000 --- a/sass/_activation.scss +++ /dev/null @@ -1,26 +0,0 @@ -body.activation { - footer { - max-width: 600px; - text-align: center; - - p { - float: none; - } - - ul { - display: none; - } - } -} - -section.activation { - @extend .wrapper; - @include box-shadow(0 1px 0 #fff); - @include box-sizing(border-box); - background: #fff; - border-top: 0; - border: 1px solid #ccc; - max-width: 600px; - padding: lh(); - margin-top: lh(); -} diff --git a/sass/_base-variables.scss b/sass/_base-variables.scss deleted file mode 100644 index c89d62b3f2..0000000000 --- a/sass/_base-variables.scss +++ /dev/null @@ -1,53 +0,0 @@ -// Flexible grid -@function flex-grid($columns, $container-columns: $fg-max-columns) { - $width: $columns * $fg-column + ($columns - 1) * $fg-gutter; - $container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter; - @return percentage($width / $container-width); -} - -// Flexible grid gutter -@function flex-gutter($container-columns: $fg-max-columns, $gutter: $fg-gutter) { - $container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter; - @return percentage($gutter / $container-width); -} -// Percentage of container calculator -@function perc($width, $container-width: $max-width) { - @return percentage($width / $container-width); -} - -// Line-height -@function lh($amount: 1) { - @return $body-line-height * $amount; -} - -// Variables -// ---------------------------------------- // - -// fonts -$body-font-family: "Open 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); - -//Flexible grid -$fg-column: $column-width; -$fg-gutter: $gutter-width; -$fg-max-columns: $columns; -$fg-max-width: 1400px; -$fg-min-width: 810px; - -// color -$light-gray: #ddd; -$dark-gray: #333; -$mit-red: #993333; - -$text-color: $dark-gray; -$border-color: $light-gray; diff --git a/sass/_index.scss b/sass/_index.scss deleted file mode 100644 index 163c46305e..0000000000 --- a/sass/_index.scss +++ /dev/null @@ -1,478 +0,0 @@ -body { - background-color: #fff; - color: #444; - font: $body-font-size $body-font-family; - - :focus { - outline-color: #ccc; - } - - h1 { - font: 800 24px $header-font-family; - } - - li { - margin-bottom: lh(); - } - - em { - font-style: italic; - } - - a { - color: $mit-red; - font-style: italic; - text-decoration: none; - - &:hover, &:focus { - color: darken($mit-red, 10%); - } - } - - #{$all-text-inputs}, textarea { - @include box-shadow(0 -1px 0 #fff); - @include linear-gradient(#eee, #fff); - border: 1px solid #999; - font: $body-font-size $body-font-family; - padding: 4px; - width: 100%; - - &:focus { - border-color: $mit-red; - } - } -} - -header.announcement { - @include background-size(cover); - background: #333; - border-bottom: 1px solid #000; - color: #fff; - -webkit-font-smoothing: antialiased; - - &.home { - background: #e3e3e3 url("/static/images/marketing/shot-5-medium.jpg"); - - @media screen and (min-width: 1200px) { - background: #e3e3e3 url("/static/images/marketing/shot-5-large.jpg"); - } - - div { - padding: lh(10) lh() lh(3); - - //hide login link for homepage - nav { - h1 { - margin-right: 0; - } - - a.login { - display: none; - } - } - } - } - - &.course { - background: #e3e3e3 url("/static/images/marketing/course-bg-small.jpg"); - - @media screen and (min-width: 1200px) { - background: #e3e3e3 url("/static/images/marketing/course-bg-large.jpg"); - } - - @media screen and (max-width: 1199px) and (min-width: 700px) { - background: #e3e3e3 url("/static/images/marketing/course-bg-medium.jpg"); - } - - div { - padding: lh(4) lh() lh(2); - } - } - - div { - @extend .wrapper; - position: relative; - - nav { - position: absolute; - top: 0; - right: lh(); - @include border-radius(0 0 3px 3px); - background: #333; - background: rgba(#000, .7); - padding: lh(.5) lh(); - - h1 { - @include inline-block(); - margin-right: lh(.5); - - a { - font: italic 800 18px $header-font-family; - color: #fff; - text-decoration: none; - - &:hover, &:focus { - color: #999; - } - } - } - - a.login { - text-decoration: none; - color: #fff; - font-size: 12px; - font-style: normal; - font-family: $header-font-family; - - &:hover, &:focus { - color: #999; - } - } - } - - section { - @extend .clearfix; - @include inline-block(); - background: $mit-red; - margin-left: flex-grid(4) + flex-gutter(); - padding: lh() lh(1.5); - - h1 { - @include inline-block(); - font-family: "Open Sans"; - font-size: 30px; - font-weight: 800; - line-height: 1.2em; - margin: 0 lh() 0 0; - } - - h2 { - @include inline-block(); - font-family: "Open Sans"; - font-size: 24px; - font-weight: 400; - line-height: 1.2em; - } - - &.course { - section { - width: flex-grid(4, 8); - margin-right: flex-gutter(8); - float: left; - margin-left: 0; - padding: 0; - - a { - @extend .button; - @include box-shadow(inset 0 1px 0 darken($mit-red, 10%), 0 1px 0 lighten($mit-red, 5%)); - background-color: darken($mit-red, 20%); - display: block; - padding: lh(.5) lh(); - border-color: darken($mit-red, 30%); - text-align: center; - - &:hover { - background-color: darken($mit-red, 10%); - border-color: darken($mit-red, 20%); - } - } - } - - p { - width: flex-grid(4, 8); - line-height: lh(); - float: left; - } - } - } - } -} - -section.index-content { - @extend .wrapper; - @extend .clearfix; - - section { - @extend .clearfix; - float: left; - - h1 { - font-size: 24px; - font-weight: 800; - font-family: "Open Sans"; - margin-bottom: lh(); - } - - p { - line-height: lh(); - margin-bottom: lh(); - } - - ul { - margin: 0; - // list-style: disc outside none; - - // li { - // list-style: disc outside none; - // } - } - - &.about { - @include box-sizing(border-box); - border-right: 1px solid #e5e5e5; - margin-right: flex-gutter(); - padding-right: flex-gutter() / 2; - width: flex-grid(8); - - section { - @extend .clearfix; - margin-bottom: lh(); - - p { - width: flex-grid(4, 8); - float: left; - - &:nth-child(odd) { - margin-right: flex-gutter(8); - } - } - - &.intro { - section { - margin-bottom: 0; - - &.intro-text { - margin-right: flex-gutter(8); - width: flex-grid(4, 8); - - p { - margin-right: 0; - width: auto; - float: none; - } - } - - &.intro-video { - width: flex-grid(4, 8); - - a { - display: block; - width: 100%; - - img { - width: 100%; - } - - span { - display: none; - } - } - } - } - } - - &.features { - border-top: 1px solid #E5E5E5; - padding-top: lh(); - margin-bottom: 0; - - h2 { - text-transform: uppercase; - letter-spacing: 1px; - color: #666; - margin-bottom: lh(); - - span { - text-transform: none; - } - } - - p { - width: auto; - clear: both; - - strong { - font-family: "Open sans"; - font-weight: 800; - } - - a { - color: $mit-red; - text-decoration: none; - @include transition(); - - &:hover, &:focus { - color: darken($mit-red, 15%); - } - } - } - - ul { - margin-bottom: 0; - - li { - line-height: lh(); - width: flex-grid(4, 8); - float: left; - margin-bottom: lh(.5); - - &:nth-child(odd) { - margin-right: flex-gutter(8); - } - } - } - } - } - } - - &.course, &.staff { - width: flex-grid(4); - - h1 { - font: normal $body-font-size $body-font-family; - text-transform: uppercase; - letter-spacing: 1px; - color: #666; - margin-bottom: lh(); - } - - h2 { - font: 800 24px $header-font-family; - } - - h3 { - font: 400 18px $header-font-family; - } - - a { - @extend .button; - } - - ul { - list-style: none; - - li { - img { - float: left; - margin-right: lh(.5); - } - } - } - } - - &.course { - h2 { - padding-top: lh(5); - background: url('/static/images/marketing/circuits-bg.jpg') 0 0 no-repeat; - @include background-size(contain); - - @media screen and (max-width: 998px) { - background: url('/static/images/marketing/circuits-medium-bg.jpg') 0 0 no-repeat; - } - } - } - - - // index - //---------------------------------------- // - &.about-course { - @include box-sizing(border-box); - border-right: 1px solid #e5e5e5; - margin-right: flex-gutter(); - padding-right: flex-gutter() / 2; - width: flex-grid(8); - - section { - width: flex-grid(4, 8); - - - &.about-info { - margin-right: flex-gutter(8); - } - - &.requirements { - clear: both; - width: 100%; - border-top: 1px solid #E5E5E5; - padding-top: lh(); - margin-bottom: 0; - - p { - float: left; - width: flex-grid(4, 8); - margin-right: flex-gutter(8); - - &:nth-child(odd) { - margin-right: 0; - } - } - } - - &.cta { - width: 100%; - text-align: center; - - a.enroll { - @extend .button; - padding: lh(.5) lh(2); - @include inline-block(); - text-align: center; - font: 800 18px $header-font-family; - } - } - } - } - } -} - -section.copyright, section.tos, section.privacy-policy, section.honor-code { - @extend .subpage; -} - -footer { - @extend .wrapper; - @extend .clearfix; - padding-top: 0; - - div.footer-wrapper { - border-top: 1px solid #e5e5e5; - padding: lh() 0; - background: url('/static/images/marketing/mit-logo.png') right center no-repeat; - - a { - color: #888; - text-decoration: none; - @include transition(); - - &:hover, &:focus { - color: #666; - } - } - - p { - @include inline-block(); - margin-right: lh(); - } - - ul { - @include inline-block(); - - li { - @include inline-block(); - - &:after { - content: ' |'; - display: inline; - color: #ccc; - } - - &:last-child { - &:after { - content: none; - } - } - - } - } - } -} diff --git a/sass/_jquery-ui-1.8.16.custom.scss b/sass/_jquery-ui-1.8.16.custom.scss new file mode 100644 index 0000000000..d03e1ca7a2 --- /dev/null +++ b/sass/_jquery-ui-1.8.16.custom.scss @@ -0,0 +1,568 @@ +/* + * jQuery UI CSS Framework 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Theming/API + */ + +/* Layout helpers +----------------------------------*/ +.ui-helper-hidden { display: none; } +.ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); } +.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } +.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } +.ui-helper-clearfix { display: inline-block; } +/* required comment for clearfix to work in Opera \*/ +* html .ui-helper-clearfix { height:1%; } +.ui-helper-clearfix { display:block; } +/* end clearfix */ +.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); } + + +/* Interaction Cues +----------------------------------*/ +.ui-state-disabled { cursor: default !important; } + + +/* Icons +----------------------------------*/ + +/* states and images */ +.ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } + + +/* Misc visuals +----------------------------------*/ + +/* Overlays */ +.ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } + + +/* + * jQuery UI CSS Framework 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Theming/API + * + * To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Helvetica,%20Arial,%20sans-serif&fwDefault=bold&fsDefault=1.1em&cornerRadius=2px&bgColorHeader=7fbcfd&bgTextureHeader=03_highlight_soft.png&bgImgOpacityHeader=50&borderColorHeader=dae5c9&fcHeader=031634&iconColorHeader=031634&bgColorContent=ffffff&bgTextureContent=01_flat.png&bgImgOpacityContent=75&borderColorContent=dae5c9&fcContent=031634&iconColorContent=adcc80&bgColorDefault=7fbcdf&bgTextureDefault=03_highlight_soft.png&bgImgOpacityDefault=100&borderColorDefault=dae5c9&fcDefault=7a994c&iconColorDefault=adcc80&bgColorHover=bddeff&bgTextureHover=03_highlight_soft.png&bgImgOpacityHover=25&borderColorHover=7fbcdf&fcHover=7a994c&iconColorHover=adcc80&bgColorActive=023063&bgTextureActive=02_glass.png&bgImgOpacityActive=65&borderColorActive=dae5c9&fcActive=dae5c9&iconColorActive=454545&bgColorHighlight=ffffff&bgTextureHighlight=01_flat.png&bgImgOpacityHighlight=55&borderColorHighlight=cccccc&fcHighlight=444444&iconColorHighlight=adcc80&bgColorError=ffffff&bgTextureError=01_flat.png&bgImgOpacityError=55&borderColorError=fa720a&fcError=222222&iconColorError=fa720a&bgColorOverlay=eeeeee&bgTextureOverlay=01_flat.png&bgImgOpacityOverlay=0&opacityOverlay=80&bgColorShadow=aaaaaa&bgTextureShadow=01_flat.png&bgImgOpacityShadow=0&opacityShadow=60&thicknessShadow=4px&offsetTopShadow=-4px&offsetLeftShadow=-4px&cornerRadiusShadow=0px + */ + + +/* Component containers +----------------------------------*/ +.ui-widget { font-family: Helvetica, Arial, sans-serif; font-size: 1.1em; } +.ui-widget .ui-widget { font-size: 1em; } +.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Helvetica, Arial, sans-serif; font-size: 1em; } +.ui-widget-content { border: 1px solid #dae5c9; background: #ffffff url(images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x; color: #031634; } +.ui-widget-content a { color: #031634; } +.ui-widget-header { border: 1px solid #dae5c9; background: #7fbcfd url(images/ui-bg_highlight-soft_50_7fbcfd_1x100.png) 50% 50% repeat-x; color: #031634; font-weight: bold; } +.ui-widget-header a { color: #031634; } + +/* Interaction states +----------------------------------*/ +.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #dae5c9; background: #7fbcdf url(images/ui-bg_highlight-soft_100_7fbcdf_1x100.png) 50% 50% repeat-x; font-weight: bold; color: #7a994c; } +.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #7a994c; text-decoration: none; } +.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #7fbcdf; background: #bddeff url(images/ui-bg_highlight-soft_25_bddeff_1x100.png) 50% 50% repeat-x; font-weight: bold; color: #7a994c; } +.ui-state-hover a, .ui-state-hover a:hover { color: #7a994c; text-decoration: none; } +.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #dae5c9; background: #023063 url(images/ui-bg_glass_65_023063_1x400.png) 50% 50% repeat-x; font-weight: bold; color: #dae5c9; } +.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #dae5c9; text-decoration: none; } +.ui-widget :active { outline: none; } + +/* Interaction Cues +----------------------------------*/ +.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {border: 1px solid #cccccc; background: #ffffff url(images/ui-bg_flat_55_ffffff_40x100.png) 50% 50% repeat-x; color: #444444; } +.ui-state-highlight a, .ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a { color: #444444; } +.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #fa720a; background: #ffffff url(images/ui-bg_flat_55_ffffff_40x100.png) 50% 50% repeat-x; color: #222222; } +.ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #222222; } +.ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #222222; } +.ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } +.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; } +.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; } + +/* Icons +----------------------------------*/ + +/* states and images */ +.ui-icon { width: 16px; height: 16px; background-image: url(images/ui-icons_adcc80_256x240.png); } +.ui-widget-content .ui-icon {background-image: url(images/ui-icons_adcc80_256x240.png); } +.ui-widget-header .ui-icon {background-image: url(images/ui-icons_031634_256x240.png); } +.ui-state-default .ui-icon { background-image: url(images/ui-icons_adcc80_256x240.png); } +.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(images/ui-icons_adcc80_256x240.png); } +.ui-state-active .ui-icon {background-image: url(images/ui-icons_454545_256x240.png); } +.ui-state-highlight .ui-icon {background-image: url(images/ui-icons_adcc80_256x240.png); } +.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(images/ui-icons_fa720a_256x240.png); } + +/* positioning */ +.ui-icon-carat-1-n { background-position: 0 0; } +.ui-icon-carat-1-ne { background-position: -16px 0; } +.ui-icon-carat-1-e { background-position: -32px 0; } +.ui-icon-carat-1-se { background-position: -48px 0; } +.ui-icon-carat-1-s { background-position: -64px 0; } +.ui-icon-carat-1-sw { background-position: -80px 0; } +.ui-icon-carat-1-w { background-position: -96px 0; } +.ui-icon-carat-1-nw { background-position: -112px 0; } +.ui-icon-carat-2-n-s { background-position: -128px 0; } +.ui-icon-carat-2-e-w { background-position: -144px 0; } +.ui-icon-triangle-1-n { background-position: 0 -16px; } +.ui-icon-triangle-1-ne { background-position: -16px -16px; } +.ui-icon-triangle-1-e { background-position: -32px -16px; } +.ui-icon-triangle-1-se { background-position: -48px -16px; } +.ui-icon-triangle-1-s { background-position: -64px -16px; } +.ui-icon-triangle-1-sw { background-position: -80px -16px; } +.ui-icon-triangle-1-w { background-position: -96px -16px; } +.ui-icon-triangle-1-nw { background-position: -112px -16px; } +.ui-icon-triangle-2-n-s { background-position: -128px -16px; } +.ui-icon-triangle-2-e-w { background-position: -144px -16px; } +.ui-icon-arrow-1-n { background-position: 0 -32px; } +.ui-icon-arrow-1-ne { background-position: -16px -32px; } +.ui-icon-arrow-1-e { background-position: -32px -32px; } +.ui-icon-arrow-1-se { background-position: -48px -32px; } +.ui-icon-arrow-1-s { background-position: -64px -32px; } +.ui-icon-arrow-1-sw { background-position: -80px -32px; } +.ui-icon-arrow-1-w { background-position: -96px -32px; } +.ui-icon-arrow-1-nw { background-position: -112px -32px; } +.ui-icon-arrow-2-n-s { background-position: -128px -32px; } +.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; } +.ui-icon-arrow-2-e-w { background-position: -160px -32px; } +.ui-icon-arrow-2-se-nw { background-position: -176px -32px; } +.ui-icon-arrowstop-1-n { background-position: -192px -32px; } +.ui-icon-arrowstop-1-e { background-position: -208px -32px; } +.ui-icon-arrowstop-1-s { background-position: -224px -32px; } +.ui-icon-arrowstop-1-w { background-position: -240px -32px; } +.ui-icon-arrowthick-1-n { background-position: 0 -48px; } +.ui-icon-arrowthick-1-ne { background-position: -16px -48px; } +.ui-icon-arrowthick-1-e { background-position: -32px -48px; } +.ui-icon-arrowthick-1-se { background-position: -48px -48px; } +.ui-icon-arrowthick-1-s { background-position: -64px -48px; } +.ui-icon-arrowthick-1-sw { background-position: -80px -48px; } +.ui-icon-arrowthick-1-w { background-position: -96px -48px; } +.ui-icon-arrowthick-1-nw { background-position: -112px -48px; } +.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; } +.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; } +.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; } +.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; } +.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; } +.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; } +.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; } +.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; } +.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; } +.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; } +.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; } +.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; } +.ui-icon-arrowreturn-1-w { background-position: -64px -64px; } +.ui-icon-arrowreturn-1-n { background-position: -80px -64px; } +.ui-icon-arrowreturn-1-e { background-position: -96px -64px; } +.ui-icon-arrowreturn-1-s { background-position: -112px -64px; } +.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; } +.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; } +.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; } +.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; } +.ui-icon-arrow-4 { background-position: 0 -80px; } +.ui-icon-arrow-4-diag { background-position: -16px -80px; } +.ui-icon-extlink { background-position: -32px -80px; } +.ui-icon-newwin { background-position: -48px -80px; } +.ui-icon-refresh { background-position: -64px -80px; } +.ui-icon-shuffle { background-position: -80px -80px; } +.ui-icon-transfer-e-w { background-position: -96px -80px; } +.ui-icon-transferthick-e-w { background-position: -112px -80px; } +.ui-icon-folder-collapsed { background-position: 0 -96px; } +.ui-icon-folder-open { background-position: -16px -96px; } +.ui-icon-document { background-position: -32px -96px; } +.ui-icon-document-b { background-position: -48px -96px; } +.ui-icon-note { background-position: -64px -96px; } +.ui-icon-mail-closed { background-position: -80px -96px; } +.ui-icon-mail-open { background-position: -96px -96px; } +.ui-icon-suitcase { background-position: -112px -96px; } +.ui-icon-comment { background-position: -128px -96px; } +.ui-icon-person { background-position: -144px -96px; } +.ui-icon-print { background-position: -160px -96px; } +.ui-icon-trash { background-position: -176px -96px; } +.ui-icon-locked { background-position: -192px -96px; } +.ui-icon-unlocked { background-position: -208px -96px; } +.ui-icon-bookmark { background-position: -224px -96px; } +.ui-icon-tag { background-position: -240px -96px; } +.ui-icon-home { background-position: 0 -112px; } +.ui-icon-flag { background-position: -16px -112px; } +.ui-icon-calendar { background-position: -32px -112px; } +.ui-icon-cart { background-position: -48px -112px; } +.ui-icon-pencil { background-position: -64px -112px; } +.ui-icon-clock { background-position: -80px -112px; } +.ui-icon-disk { background-position: -96px -112px; } +.ui-icon-calculator { background-position: -112px -112px; } +.ui-icon-zoomin { background-position: -128px -112px; } +.ui-icon-zoomout { background-position: -144px -112px; } +.ui-icon-search { background-position: -160px -112px; } +.ui-icon-wrench { background-position: -176px -112px; } +.ui-icon-gear { background-position: -192px -112px; } +.ui-icon-heart { background-position: -208px -112px; } +.ui-icon-star { background-position: -224px -112px; } +.ui-icon-link { background-position: -240px -112px; } +.ui-icon-cancel { background-position: 0 -128px; } +.ui-icon-plus { background-position: -16px -128px; } +.ui-icon-plusthick { background-position: -32px -128px; } +.ui-icon-minus { background-position: -48px -128px; } +.ui-icon-minusthick { background-position: -64px -128px; } +.ui-icon-close { background-position: -80px -128px; } +.ui-icon-closethick { background-position: -96px -128px; } +.ui-icon-key { background-position: -112px -128px; } +.ui-icon-lightbulb { background-position: -128px -128px; } +.ui-icon-scissors { background-position: -144px -128px; } +.ui-icon-clipboard { background-position: -160px -128px; } +.ui-icon-copy { background-position: -176px -128px; } +.ui-icon-contact { background-position: -192px -128px; } +.ui-icon-image { background-position: -208px -128px; } +.ui-icon-video { background-position: -224px -128px; } +.ui-icon-script { background-position: -240px -128px; } +.ui-icon-alert { background-position: 0 -144px; } +.ui-icon-info { background-position: -16px -144px; } +.ui-icon-notice { background-position: -32px -144px; } +.ui-icon-help { background-position: -48px -144px; } +.ui-icon-check { background-position: -64px -144px; } +.ui-icon-bullet { background-position: -80px -144px; } +.ui-icon-radio-off { background-position: -96px -144px; } +.ui-icon-radio-on { background-position: -112px -144px; } +.ui-icon-pin-w { background-position: -128px -144px; } +.ui-icon-pin-s { background-position: -144px -144px; } +.ui-icon-play { background-position: 0 -160px; } +.ui-icon-pause { background-position: -16px -160px; } +.ui-icon-seek-next { background-position: -32px -160px; } +.ui-icon-seek-prev { background-position: -48px -160px; } +.ui-icon-seek-end { background-position: -64px -160px; } +.ui-icon-seek-start { background-position: -80px -160px; } +/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */ +.ui-icon-seek-first { background-position: -80px -160px; } +.ui-icon-stop { background-position: -96px -160px; } +.ui-icon-eject { background-position: -112px -160px; } +.ui-icon-volume-off { background-position: -128px -160px; } +.ui-icon-volume-on { background-position: -144px -160px; } +.ui-icon-power { background-position: 0 -176px; } +.ui-icon-signal-diag { background-position: -16px -176px; } +.ui-icon-signal { background-position: -32px -176px; } +.ui-icon-battery-0 { background-position: -48px -176px; } +.ui-icon-battery-1 { background-position: -64px -176px; } +.ui-icon-battery-2 { background-position: -80px -176px; } +.ui-icon-battery-3 { background-position: -96px -176px; } +.ui-icon-circle-plus { background-position: 0 -192px; } +.ui-icon-circle-minus { background-position: -16px -192px; } +.ui-icon-circle-close { background-position: -32px -192px; } +.ui-icon-circle-triangle-e { background-position: -48px -192px; } +.ui-icon-circle-triangle-s { background-position: -64px -192px; } +.ui-icon-circle-triangle-w { background-position: -80px -192px; } +.ui-icon-circle-triangle-n { background-position: -96px -192px; } +.ui-icon-circle-arrow-e { background-position: -112px -192px; } +.ui-icon-circle-arrow-s { background-position: -128px -192px; } +.ui-icon-circle-arrow-w { background-position: -144px -192px; } +.ui-icon-circle-arrow-n { background-position: -160px -192px; } +.ui-icon-circle-zoomin { background-position: -176px -192px; } +.ui-icon-circle-zoomout { background-position: -192px -192px; } +.ui-icon-circle-check { background-position: -208px -192px; } +.ui-icon-circlesmall-plus { background-position: 0 -208px; } +.ui-icon-circlesmall-minus { background-position: -16px -208px; } +.ui-icon-circlesmall-close { background-position: -32px -208px; } +.ui-icon-squaresmall-plus { background-position: -48px -208px; } +.ui-icon-squaresmall-minus { background-position: -64px -208px; } +.ui-icon-squaresmall-close { background-position: -80px -208px; } +.ui-icon-grip-dotted-vertical { background-position: 0 -224px; } +.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; } +.ui-icon-grip-solid-vertical { background-position: -32px -224px; } +.ui-icon-grip-solid-horizontal { background-position: -48px -224px; } +.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; } +.ui-icon-grip-diagonal-se { background-position: -80px -224px; } + + +/* Misc visuals +----------------------------------*/ + +/* Corner radius */ +.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 2px; -webkit-border-top-left-radius: 2px; -khtml-border-top-left-radius: 2px; border-top-left-radius: 2px; } +.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 2px; -webkit-border-top-right-radius: 2px; -khtml-border-top-right-radius: 2px; border-top-right-radius: 2px; } +.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 2px; -webkit-border-bottom-left-radius: 2px; -khtml-border-bottom-left-radius: 2px; border-bottom-left-radius: 2px; } +.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 2px; -webkit-border-bottom-right-radius: 2px; -khtml-border-bottom-right-radius: 2px; border-bottom-right-radius: 2px; } + +/* Overlays */ +.ui-widget-overlay { background: #eeeeee url(images/ui-bg_flat_0_eeeeee_40x100.png) 50% 50% repeat-x; opacity: .80;filter:Alpha(Opacity=80); } +.ui-widget-shadow { margin: -4px 0 0 -4px; padding: 4px; background: #aaaaaa url(images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .60;filter:Alpha(Opacity=60); -moz-border-radius: 0px; -khtml-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; }/* + * jQuery UI Resizable 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Resizable#theming + */ +.ui-resizable { position: relative;} +.ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block; } +.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } +.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; } +.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; } +.ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; } +.ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; } +.ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; } +.ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; } +.ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; } +.ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;}/* + * jQuery UI Selectable 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Selectable#theming + */ +.ui-selectable-helper { position: absolute; z-index: 100; border:1px dotted black; } +/* + * jQuery UI Accordion 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Accordion#theming + */ +/* IE/Win - Fix animation bug - #4615 */ +.ui-accordion { width: 100%; } +.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; } +.ui-accordion .ui-accordion-li-fix { display: inline; } +.ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; } +.ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em .7em; } +.ui-accordion-icons .ui-accordion-header a { padding-left: 2.2em; } +.ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; } +.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; } +.ui-accordion .ui-accordion-content-active { display: block; } +/* + * jQuery UI Autocomplete 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Autocomplete#theming + */ +.ui-autocomplete { position: absolute; cursor: default; } + +/* workarounds */ +* html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */ + +/* + * jQuery UI Menu 1.8.16 + * + * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Menu#theming + */ +.ui-menu { + list-style:none; + padding: 2px; + margin: 0; + display:block; + float: left; +} +.ui-menu .ui-menu { + margin-top: -3px; +} +.ui-menu .ui-menu-item { + margin:0; + padding: 0; + zoom: 1; + float: left; + clear: left; + width: 100%; +} +.ui-menu .ui-menu-item a { + text-decoration:none; + display:block; + padding:.2em .4em; + line-height:1.5; + zoom:1; +} +.ui-menu .ui-menu-item a.ui-state-hover, +.ui-menu .ui-menu-item a.ui-state-active { + font-weight: normal; + margin: -1px; +} +/* + * jQuery UI Button 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Button#theming + */ +.ui-button { display: inline-block; position: relative; padding: 0; margin-right: .1em; text-decoration: none !important; cursor: pointer; text-align: center; zoom: 1; overflow: visible; } /* the overflow property removes extra width in IE */ +.ui-button-icon-only { width: 2.2em; } /* to make room for the icon, a width needs to be set here */ +button.ui-button-icon-only { width: 2.4em; } /* button elements seem to need a little more width */ +.ui-button-icons-only { width: 3.4em; } +button.ui-button-icons-only { width: 3.7em; } + +/*button text element */ +.ui-button .ui-button-text { display: block; line-height: 1.4; } +.ui-button-text-only .ui-button-text { padding: .4em 1em; } +.ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { padding: .4em; text-indent: -9999999px; } +.ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 1em .4em 2.1em; } +.ui-button-text-icon-secondary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 2.1em .4em 1em; } +.ui-button-text-icons .ui-button-text { padding-left: 2.1em; padding-right: 2.1em; } +/* no icon support for input elements, provide padding by default */ +input.ui-button { padding: .4em 1em; } + +/*button icon element(s) */ +.ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: 50%; margin-top: -8px; } +.ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px; } +.ui-button-text-icon-primary .ui-button-icon-primary, .ui-button-text-icons .ui-button-icon-primary, .ui-button-icons-only .ui-button-icon-primary { left: .5em; } +.ui-button-text-icon-secondary .ui-button-icon-secondary, .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; } +.ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; } + +/*button sets*/ +.ui-buttonset { margin-right: 7px; } +.ui-buttonset .ui-button { margin-left: 0; margin-right: -.3em; } + +/* workarounds */ +button.ui-button::-moz-focus-inner { border: 0; padding: 0; } /* reset extra padding in Firefox */ +/* + * jQuery UI Dialog 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Dialog#theming + */ +.ui-dialog { position: absolute; padding: .2em; width: 300px; overflow: hidden; } +.ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative; } +.ui-dialog .ui-dialog-title { float: left; margin: .1em 16px .1em 0; } +.ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; } +.ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; } +.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; } +.ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1; } +.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; } +.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; } +.ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; } +.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; } +.ui-draggable .ui-dialog-titlebar { cursor: move; } +/* + * jQuery UI Slider 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Slider#theming + */ +.ui-slider { position: relative; text-align: left; } +.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; } +.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; } + +.ui-slider-horizontal { height: .8em; } +.ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; } +.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } +.ui-slider-horizontal .ui-slider-range-min { left: 0; } +.ui-slider-horizontal .ui-slider-range-max { right: 0; } + +.ui-slider-vertical { width: .8em; height: 100px; } +.ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; } +.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } +.ui-slider-vertical .ui-slider-range-min { bottom: 0; } +.ui-slider-vertical .ui-slider-range-max { top: 0; }/* + * jQuery UI Tabs 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Tabs#theming + */ +.ui-tabs { position: relative; padding: .2em; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ +.ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; } +.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; } +.ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; } +.ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px; } +.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; } +.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */ +.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; } +.ui-tabs .ui-tabs-hide { display: none !important; } +/* + * jQuery UI Datepicker 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Datepicker#theming + */ +.ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; } +.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; } +.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; } +.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; } +.ui-datepicker .ui-datepicker-prev { left:2px; } +.ui-datepicker .ui-datepicker-next { right:2px; } +.ui-datepicker .ui-datepicker-prev-hover { left:1px; } +.ui-datepicker .ui-datepicker-next-hover { right:1px; } +.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; } +.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; } +.ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; } +.ui-datepicker select.ui-datepicker-month-year {width: 100%;} +.ui-datepicker select.ui-datepicker-month, +.ui-datepicker select.ui-datepicker-year { width: 49%;} +.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; } +.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; } +.ui-datepicker td { border: 0; padding: 1px; } +.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; } +.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; } +.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; } +.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; } + +/* with multiple calendars */ +.ui-datepicker.ui-datepicker-multi { width:auto; } +.ui-datepicker-multi .ui-datepicker-group { float:left; } +.ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; } +.ui-datepicker-multi-2 .ui-datepicker-group { width:50%; } +.ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; } +.ui-datepicker-multi-4 .ui-datepicker-group { width:25%; } +.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; } +.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; } +.ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; } +.ui-datepicker-row-break { clear:both; width:100%; font-size:0em; } + +/* RTL support */ +.ui-datepicker-rtl { direction: rtl; } +.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; } +.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; } +.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; } +.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; } +.ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; } +.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; } +.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; } +.ui-datepicker-rtl .ui-datepicker-group { float:right; } +.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; } +.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; } + +/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */ +.ui-datepicker-cover { + display: none; /*sorry for IE5*/ + display/**/: block; /*sorry for IE5*/ + position: absolute; /*must have*/ + z-index: -1; /*must have*/ + filter: mask(); /*must have*/ + top: -4px; /*must have*/ + left: -4px; /*must have*/ + width: 200px; /*must have*/ + height: 200px; /*must have*/ +}/* + * jQuery UI Progressbar 1.8.16 + * + * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) + * Dual licensed under the MIT or GPL Version 2 licenses. + * http://jquery.org/license + * + * http://docs.jquery.com/UI/Progressbar#theming + */ +.ui-progressbar { height:2em; text-align: left; } +.ui-progressbar .ui-progressbar-value {margin: -1px; height:100%; } \ No newline at end of file diff --git a/sass/_layout.scss b/sass/_layout.scss deleted file mode 100644 index e124f0f62f..0000000000 --- a/sass/_layout.scss +++ /dev/null @@ -1,191 +0,0 @@ -html { - margin-top: 0; - - body { - color: $dark-gray; - font: $body-font-size $body-font-family; - text-align: center; - margin: 0; - background: #f4f4f4; //#f3f1e5 - - div.header-wrapper { - // @include linear-gradient(lighten($mit-red, 5%), darken($mit-red, 5%)); - @include box-shadow(inset 0 -1px 2px darken($mit-red, 10%)); - background: $mit-red; - border-bottom: 1px solid #fff; - - header { - @extend .clearfix; - @extend .wrapper; - @include box-sizing(border-box); - padding: 0 $body-line-height; - - hgroup { - @extend .clearfix; - float: left; - - h1 { - border-right: 1px solid darken($mit-red, 5%); - color: darken($mit-red, 25%); - font-size: 20px; - font-weight: 800; - margin: 0 lh() 0 0; - padding: 17px lh() 14px 0; - text-shadow: 0 1px 0 lighten($mit-red, 10%); - line-height: lh(); - @include inline-block(); - } - - h2 { - @include inline-block(); - margin: 0 lh() 0 0; - padding: 19px lh() 9px 0; - line-height: lh(); - border-right: 1px solid darken($mit-red, 5%); - -webkit-font-smoothing: antialiased; - - a { - color: #fff; - text-decoration: none; - - &:hover { - color: rgba(#fff, .7); - } - } - } - - @media screen and (max-width: 920px) { - border-bottom: 1px solid darken($mit-red, 5%); - display: block; - float: none; - - h1 { - float: right; - border: 0; - margin-right: 0; - padding-right: 0; - } - - h2 { - float: left; - border: 0; - margin-right: 0; - padding-right: 0; - } - } - } - - nav { - float: left; - display: block; - margin: 0; - padding: 0; - text-shadow: 0 -1px 0 darken($mit-red, 10%); - -webkit-font-smoothing: antialiased; - - - ul { - @extend .clearfix; - display: inline-block; - padding: 19px 0 9px; - margin: 0; - - li { - margin-right: lh(); - display: inline-block; - margin-bottom: 0; - line-height: lh(); - - a { - color: #fff; - text-decoration: none; - - &:hover { - color: rgba(#fff, .7); - background-color: none; - text-decoration: none; - } - } - } - } - } - } - } - - section.main-content { - @extend .clearfix; - @extend .wrapper; - @include box-sizing(border-box); - @include border-radius(4px); - overflow: hidden; - background: #fff; - border-bottom: 1px solid #bbb; - - @media screen and (min-width: 1400px) { - // @include border-radius(3px); - @include box-shadow(0 0 4px #dfdfdf); - border: 1px solid #bbb; - margin-top: lh(.5); - } - } - - 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; - - &:link, &:visited { - color: #444; - } - - &:hover, &:focus { - color: #000; - } - } - } - - ul { - float: right; - - li { - display: inline-block; - margin-right: 20px; - - a { - color: #444; - - &:link, &:visited { - color: #444; - } - - &:hover, &:focus { - color: #000; - } - } - } - } - } - - &.activation { - footer { - ul { - display: none; - } - } - } - } -} diff --git a/sass/_local.scss b/sass/_local.scss deleted file mode 100644 index bd866e3bb5..0000000000 --- a/sass/_local.scss +++ /dev/null @@ -1,36 +0,0 @@ -#hide_acc { - min-height:600; -} - -#mainblock { - border: 0; - padding: 0; - margin: 0; - width: 200; - min-height:600px; - margin-left: 276px; - margin-right: 0px; -} - -.bordered { border: 1px solid #AAAAAA; border-style : dotted; } - -.seq_problem_visited { background-color: #ccccaa;} -.seq_video_visited { background-color: #ccaacc;} -.seq_html_visited { background-color: #caaccc;} -.seq_tab_visited { background-color: #aacccc;} -.seq_vertical_visited { background-color: #acaccc;} -.seq_sequential_visited { background-color: #cacacc;} -.seq_problem_visited { background-color: #ccacac;} -.seq_schematic_visited { background-color: #cccaca;} - -.seq_problem_inactive { background-color: #aaaa99;} -.seq_video_inactive { background-color: #aa99aa;} -.seq_video_inactive { background-color: #aaa99a;} -.seq_html_inactive { background-color: #a99aaa;} -.seq_tab_inactive { background-color: #99aaaa;} -.seq_vertical_inactive { background-color: #9a9aab;} -.seq_sequential_inactive { background-color: #a9a9aa;} -.seq_problem_inactive { background-color: #aa9a9a;} -.seq_schematic_inactive { background-color: #aaa9a9;} - -.seq_active { background-color: red;} diff --git a/sass/_theme.scss b/sass/_theme.scss deleted file mode 100644 index 31e45ae734..0000000000 --- a/sass/_theme.scss +++ /dev/null @@ -1,190 +0,0 @@ -/* ----------------------------------------------------------------------------------------- - -Copyright 2010 - Thierry Ruiz - www.dotemplate.com - All rights reserved. - -THIS TEMPLATE IS FREE AS LONG AS YOU KEEP THE LINK TO WWW.DOTEMPLATE.COM IN THE FOOTER -TO REMOVE THE LINK, PLEASE MAKE A 10 DOLLARS DONATION at www.dotemplate.com/#donate - -pmitros donated $10 - -Colors: -Light blue: bddeff - Blue: 7fbcfd -Very dark blue: #031634 - -Dark blue: #023063; -Dark Greenish: #7a994c; -Greenish: #adcc80; -Very light greenish: #dae5c9; -Bright orange: #fa720a; - ----------------------------------------------------------------------------------------- -*/ - - -h1 { - clear:both; -} - -h2 { - clear:both; -} - -h3 { - font-size:1em; - margin:20px 0 5px 0; - clear:both; -} - -#wrapper { - background: transparent url( images/css/page-vbg.jpg ) repeat-y scroll 50% 0px; - margin:0 auto ; - width:100%; -} - -// marketing pages -#topWrapper { - width:100%; - height:100px; - background-image:url(images/css/topWrapper-bg.jpg); - background-position:center top ; - background-repeat:repeat-x; -} - -#topBanner { - width:800px; - margin:0 auto; - height:100px; - background-image:url(images/css/topBanner.jpg); - background-repeat:no-repeat; -} - -#topnav { - background:transparent url('images/css/hmenu.jpg') repeat-x top left; - height:20px; - margin:0 auto ; - text-align:center; - width:800px; - - ul { - display:table; - margin:0 auto; - padding:0; - list-style-type:none; - position:relative; - height:20px; - text-transform:uppercase; - font-size:0.9em; - font-family:Arial,sans-serif; - - li { - display:block; - float:left; - margin:0; - padding:0; - background:transparent url('images/css/hmenu.jpg') repeat-x top left; - - a { - display:block; - float:left; - color:#031634; - text-decoration:none; - padding:0px 50px ; - line-height:20px; - font-weight:bold; - } - } - } -} - -#topnav ul li a:hover, #topnav li#current a { - color:#7a994c; - background:transparent url('images/css/hmenu-sel.jpg') repeat-x top left; -} - -#bg { - margin:0 auto; - padding:0; - background:transparent ; - background-image:url(images/css/hat.jpg); - background-repeat:no-repeat; - background-position: center top ; -} - -#header { - margin: 0 auto; - min-height:0px; - height: 0px; - width: 800px; -} - - -#page { - background: transparent url( images/css/page-bg.jpg ) no-repeat center top; -} - -#container { - margin:0 auto; - width:800px; -} - - -#content { - width:780px; - margin:0 auto ; - text-align:left; - min-height:800px; -} - - -#content p { - text-align:justify; -} - - - - - -#footerWrapper { - margin:0 auto; - height:10px; - padding:0; - background:transparent url( images/css/footerWrapper-bg.jpg ) no-repeat scroll center top; -} - - -#footer { - margin:0 auto; - padding:0; - width:800px; - height:10px; -} - -#sidebar ul.vmenu { - list-style: none; - text-align: left; - margin: 7px 0px 8px 0px; - padding: 0; - text-decoration: none; - border-top: 1px solid #eeeeee; -} - -#sidebar ul.vmenu li { - list-style: none; - padding: 4px 0 4px 0px; - margin: 0 2px; - border-bottom: 1px solid #eeeeee; -} - -#sidebar ul.vmenu li a { - text-decoration: none; - color:#023063; -} - -#sidebar ul.vmenu li a:hover { - color:#adcc80; -} - -#sidebar ul.vmenu ul { margin: 0 0 0 5px; padding: 0; } -#sidebar ul.vmenu ul li { border: none; } diff --git a/sass/application.scss b/sass/application.scss index 63b6ce1d20..e26dc21221 100644 --- a/sass/application.scss +++ b/sass/application.scss @@ -1,21 +1,16 @@ @import "bourbon/bourbon"; -@import "reset"; -@import "font-face"; // Base layout -@import "base-variables", "base-extends", "base"; -@import "layout"; -@import "leanmodal"; +@import "base/reset", "base/font-face"; +@import "base/variables", "base/functions", "base/extends", "base/base"; +@import "layout/layout", "layout/header", "layout/footer", "layout/leanmodal"; +@import "jquery-ui-1.8.16.custom"; // pages -@import "courseware", "courseware-video", "courseware-sequence-nav"; +@import "courseware/courseware", "courseware/sidebar", "courseware/video", "courseware/sequence-nav"; @import "textbook"; @import "info"; @import "profile"; -@import "wiki-basic-html", "wiki-create", "wiki"; +@import "wiki/basic-html", "wiki/sidebar", "wiki/create", "wiki/wiki"; @import "help"; -@import "askbot-original", "discussion", "discussion-questions", "discussion-tags", "question-view" , "discussion-answers", "discussion-forms", "form-wmd-toolbar"; - -// left over -// @import "theme"; -// @import "local"; +@import "discussion/askbot-original", "discussion/discussion", "discussion/questions", "discussion/tags", "discussion/question-view" , "discussion/answers", "discussion/forms", "discussion/form-wmd-toolbar"; diff --git a/sass/_base.scss b/sass/base/_base.scss similarity index 95% rename from sass/_base.scss rename to sass/base/_base.scss index 8ea0957ac3..fd3f7774f7 100644 --- a/sass/_base.scss +++ b/sass/base/_base.scss @@ -29,6 +29,11 @@ em { font-style: italic; } +img { + max-width: 100%; + height: auto; +} + #{$all-text-inputs}, textarea { @include box-shadow(0 -1px 0 #fff); @include linear-gradient(#eee, #fff); diff --git a/sass/_base-extends.scss b/sass/base/_extends.scss similarity index 100% rename from sass/_base-extends.scss rename to sass/base/_extends.scss diff --git a/sass/_font-face.scss b/sass/base/_font-face.scss similarity index 100% rename from sass/_font-face.scss rename to sass/base/_font-face.scss diff --git a/sass/_index-functions.scss b/sass/base/_functions.scss similarity index 76% rename from sass/_index-functions.scss rename to sass/base/_functions.scss index d0777bd813..429c202226 100644 --- a/sass/_index-functions.scss +++ b/sass/base/_functions.scss @@ -1,6 +1,3 @@ -// Functions -//---------------------------------------- // - // Flexible grid @function flex-grid($columns, $container-columns: $fg-max-columns) { $width: $columns * $fg-column + ($columns - 1) * $fg-gutter; @@ -14,8 +11,13 @@ @return percentage($gutter / $container-width); } -// Line-height -@function lh($amount: 1) { - @return $lh * $amount; +// Percentage of container calculator +@function perc($width, $container-width: $max-width) { + @return percentage($width / $container-width); +} + +// Line-height +@function lh($amount: 1) { + @return $body-line-height * $amount; } diff --git a/sass/_reset.scss b/sass/base/_reset.scss similarity index 100% rename from sass/_reset.scss rename to sass/base/_reset.scss diff --git a/sass/base/_variables.scss b/sass/base/_variables.scss new file mode 100644 index 0000000000..249f92dc96 --- /dev/null +++ b/sass/base/_variables.scss @@ -0,0 +1,31 @@ +// Variables +// ---------------------------------------- // + +// fonts +$body-font-family: "Open 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); + +//Flexible grid +$fg-column: $column-width; +$fg-gutter: $gutter-width; +$fg-max-columns: $columns; +$fg-max-width: 1400px; +$fg-min-width: 810px; + +// color +$light-gray: #ddd; +$dark-gray: #333; +$mit-red: #993333; + +$text-color: $dark-gray; +$border-color: $light-gray; diff --git a/sass/bourbon/_bourbon.scss b/sass/bourbon/_bourbon.scss index 5c1bc8a4a9..447167c5ab 100644 --- a/sass/bourbon/_bourbon.scss +++ b/sass/bourbon/_bourbon.scss @@ -1,7 +1,7 @@ // Custom Functions @import "functions/deprecated-webkit-gradient"; -@import "functions/golden-ratio"; @import "functions/grid-width"; +@import "functions/modular-scale"; @import "functions/tint-shade"; // CSS3 Mixins diff --git a/sass/bourbon/addons/_button.scss b/sass/bourbon/addons/_button.scss index d2f98ab0c3..1d32125140 100644 --- a/sass/bourbon/addons/_button.scss +++ b/sass/bourbon/addons/_button.scss @@ -5,31 +5,59 @@ $style: simple; } - @if $style == simple { - @include simple($base-color); + // Grayscale button + @if $base-color == grayscale($base-color) { + @if $style == simple { + @include simple($base-color, $grayscale: true); + } + + @else if $style == shiny { + @include shiny($base-color, $grayscale: true); + } + + @else if $style == pill { + @include pill($base-color, $grayscale: true); + } } - @else if $style == shiny { - @include shiny($base-color); - } + // Colored button + @else { + @if $style == simple { + @include simple($base-color); + } - @else if $style == pill { - @include pill($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%); + +// Simple Button +//************************************************************************// +@mixin simple($base-color, $grayscale: false) { + $color: hsl(0, 0, 100%); + $border: adjust-color($base-color, $saturation: 9%, $lightness: -14%); + $inset-shadow: adjust-color($base-color, $saturation: -8%, $lightness: 15%); + $stop-gradient: adjust-color($base-color, $saturation: 9%, $lightness: -11%); + $text-shadow: adjust-color($base-color, $saturation: 15%, $lightness: -18%); @if lightness($base-color) > 70% { - $color: hsl(0, 0, 20%); + $color: hsl(0, 0, 20%); $text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%); } + @if $grayscale == true { + $border: grayscale($border); + $inset-shadow: grayscale($inset-shadow); + $stop-gradient: grayscale($stop-gradient); + $text-shadow: grayscale($text-shadow); + } + border: 1px solid $border; @include border-radius (3px); @include box-shadow (inset 0 1px 0 0 $inset-shadow); @@ -43,9 +71,15 @@ -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%); + $base-color-hover: adjust-color($base-color, $saturation: -4%, $lightness: -5%); + $inset-shadow-hover: adjust-color($base-color, $saturation: -7%, $lightness: 5%); + $stop-gradient-hover: adjust-color($base-color, $saturation: 8%, $lightness: -14%); + + @if $grayscale == true { + $base-color-hover: grayscale($base-color-hover); + $inset-shadow-hover: grayscale($inset-shadow-hover); + $stop-gradient-hover: grayscale($stop-gradient-hover); + } @include box-shadow (inset 0 1px 0 0 $inset-shadow-hover); cursor: pointer; @@ -53,30 +87,47 @@ } &:active { - $border-active: adjust-color($base-color, $saturation: 9%, $lightness: -14%); + $border-active: adjust-color($base-color, $saturation: 9%, $lightness: -14%); $inset-shadow-active: adjust-color($base-color, $saturation: 7%, $lightness: -17%); + @if $grayscale == true { + $border-active: grayscale($border-active); + $inset-shadow-active: grayscale($inset-shadow-active); + } + 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); + +// Shiny Button +//************************************************************************// +@mixin shiny($base-color, $grayscale: false) { + $color: hsl(0, 0, 100%); + $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); + $fourth-stop: adjust-color($base-color, $red: -79, $green: -70, $blue: -46); + $inset-shadow: adjust-color($base-color, $red: 37, $green: 29, $blue: 12); + $second-stop: adjust-color($base-color, $red: -56, $green: -50, $blue: -33); + $text-shadow: adjust-color($base-color, $red: -140, $green: -141, $blue: -114); + $third-stop: adjust-color($base-color, $red: -86, $green: -75, $blue: -48); @if lightness($base-color) > 70% { - $color: hsl(0, 0, 20%); + $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%); + @if $grayscale == true { + $border: grayscale($border); + $border-bottom: grayscale($border-bottom); + $fourth-stop: grayscale($fourth-stop); + $inset-shadow: grayscale($inset-shadow); + $second-stop: grayscale($second-stop); + $text-shadow: grayscale($text-shadow); + $third-stop: grayscale($third-stop); + } + border: 1px solid $border; border-bottom: 1px solid $border-bottom; @include border-radius(5px); @@ -85,43 +136,69 @@ display: inline; font-size: 14px; font-weight: bold; + @include linear-gradient(top, $base-color 0%, $second-stop 50%, $third-stop 50%, $fourth-stop 100%); padding: 7px 20px 8px; - text-decoration: none; text-align: center; + text-decoration: none; text-shadow: 0 -1px 1px $text-shadow; &:hover { - $first-stop-hover: adjust-color($base-color, $red: -13, $green: -15, $blue: -18); + $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); + $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%); + @if $grayscale == true { + $first-stop-hover: grayscale($first-stop-hover); + $second-stop-hover: grayscale($second-stop-hover); + $third-stop-hover: grayscale($third-stop-hover); + $fourth-stop-hover: grayscale($fourth-stop-hover); + } + cursor: pointer; + @include linear-gradient(top, $first-stop-hover 0%, + $second-stop-hover 50%, + $third-stop-hover 50%, + $fourth-stop-hover 100%); } &:active { $inset-shadow-active: adjust-color($base-color, $red: -111, $green: -116, $blue: -122); + @if $grayscale == true { + $inset-shadow-active: grayscale($inset-shadow-active); + } + @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%); + +// Pill Button +//************************************************************************// +@mixin pill($base-color, $grayscale: false) { + $color: hsl(0, 0, 100%); + $border-bottom: adjust-color($base-color, $hue: 8, $saturation: -11%, $lightness: -26%); + $border-sides: adjust-color($base-color, $hue: 4, $saturation: -21%, $lightness: -21%); + $border-top: adjust-color($base-color, $hue: -1, $saturation: -30%, $lightness: -15%); + $inset-shadow: adjust-color($base-color, $hue: -1, $saturation: -1%, $lightness: 7%); + $stop-gradient: adjust-color($base-color, $hue: 8, $saturation: 14%, $lightness: -10%); + $text-shadow: adjust-color($base-color, $hue: 5, $saturation: -19%, $lightness: -15%); @if lightness($base-color) > 70% { - $color: hsl(0, 0, 20%); + $color: hsl(0, 0, 20%); $text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%); } - @include linear-gradient ($base-color, $stop-gradient); + @if $grayscale == true { + $border-bottom: grayscale($border-bottom); + $border-sides: grayscale($border-sides); + $border-top: grayscale($border-top); + $inset-shadow: grayscale($inset-shadow); + $stop-gradient: grayscale($stop-gradient); + $text-shadow: grayscale($text-shadow); + } + border: 1px solid $border-top; border-color: $border-top $border-sides $border-bottom; @include border-radius(16px); @@ -131,35 +208,54 @@ font-size: 11px; font-weight: normal; line-height: 1; + @include linear-gradient ($base-color, $stop-gradient); 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%); + $base-color-hover: adjust-color($base-color, $lightness: -4.5%); + $border-bottom: adjust-color($base-color, $hue: 8, $saturation: 13.5%, $lightness: -32%); + $border-sides: adjust-color($base-color, $hue: 4, $saturation: -2%, $lightness: -27%); + $border-top: adjust-color($base-color, $hue: -1, $saturation: -17%, $lightness: -21%); + $inset-shadow-hover: adjust-color($base-color, $saturation: -1%, $lightness: 3%); + $stop-gradient-hover: adjust-color($base-color, $hue: 8, $saturation: -4%, $lightness: -15.5%); + $text-shadow-hover: adjust-color($base-color, $hue: 5, $saturation: -5%, $lightness: -22%); + + @if $grayscale == true { + $base-color-hover: grayscale($base-color-hover); + $border-bottom: grayscale($border-bottom); + $border-sides: grayscale($border-sides); + $border-top: grayscale($border-top); + $inset-shadow-hover: grayscale($inset-shadow-hover); + $stop-gradient-hover: grayscale($stop-gradient-hover); + $text-shadow-hover: grayscale($text-shadow-hover); + } - @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; + @include linear-gradient ($base-color-hover, $stop-gradient-hover); 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%); + $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%); + + @if $grayscale == true { + $active-color: grayscale($active-color); + $border-active: grayscale($border-active); + $border-bottom-active: grayscale($border-bottom-active); + $inset-shadow-active: grayscale($inset-shadow-active); + $text-shadow-active: grayscale($text-shadow-active); + } background: $active-color; border: 1px solid $border-active; @@ -168,3 +264,4 @@ text-shadow: 0 -1px 1px $text-shadow-active; } } + diff --git a/sass/bourbon/addons/_font-family.scss b/sass/bourbon/addons/_font-family.scss index 9e3bc6ee20..df8a80ddfc 100644 --- a/sass/bourbon/addons/_font-family.scss +++ b/sass/bourbon/addons/_font-family.scss @@ -1,4 +1,5 @@ $georgia: Georgia, Cambria, "Times New Roman", Times, serif; $helvetica: "Helvetica Neue", Helvetica, Arial, sans-serif; $lucida-grande: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif; +$monospace: "Bitstream Vera Sans Mono", Consolas, Courier, monospace; $verdana: Verdana, Geneva, sans-serif; diff --git a/sass/bourbon/css3/_animation.scss b/sass/bourbon/css3/_animation.scss index 08f3b13e61..f99e06eb6f 100644 --- a/sass/bourbon/css3/_animation.scss +++ b/sass/bourbon/css3/_animation.scss @@ -1,6 +1,22 @@ // http://www.w3.org/TR/css3-animations/#the-animation-name-property- // Each of these mixins support comma separated lists of values, which allows different transitions for individual properties to be described in a single style rule. Each value in the list corresponds to the value at that same position in the other properties. +// Official animation shorthand property. +@mixin animation ($animation-1, + $animation-2: false, $animation-3: false, + $animation-4: false, $animation-5: false, + $animation-6: false, $animation-7: false, + $animation-8: false, $animation-9: false) + { + $full: compact($animation-1, $animation-2, $animation-3, $animation-4, + $animation-5, $animation-6, $animation-7, $animation-8, $animation-9); + + -webkit-animation: $full; + -moz-animation: $full; + animation: $full; +} + +// Individual Animation Properties @mixin animation-name ($name-1, $name-2: false, $name-3: false, $name-4: false, $name-5: false, @@ -127,8 +143,7 @@ } -// Shorthand for a basic animation. Supports multiple parentheses-deliminated values for each variable. -// Example: @include animation-basic((slideup, fadein), (1.0s, 2.0s), ease-in); +// Deprecated @mixin animation-basic ($name, $time: 0, $motion: ease) { $length-of-name: length($name); $length-of-time: length($time); @@ -151,11 +166,6 @@ } @else { @include animation-timing-function( $motion); } + @warn "The animation-basic mixin is deprecated. Use the animation mixin instead."; } -// Official animation shorthand property. Needs more work to actually be useful. -@mixin animation ($name, $duration, $timing-function, $delay, $iteration-count, $direction) { - -webkit-animation: $name $duration $timing-function $delay $iteration-count $direction; - -moz-animation: $name $duration $timing-function $delay $iteration-count $direction; - animation: $name $duration $timing-function $delay $iteration-count $direction; -} diff --git a/sass/bourbon/css3/_linear-gradient.scss b/sass/bourbon/css3/_linear-gradient.scss index 585921f30b..0b68501719 100644 --- a/sass/bourbon/css3/_linear-gradient.scss +++ b/sass/bourbon/css3/_linear-gradient.scss @@ -2,7 +2,8 @@ $G3: false, $G4: false, $G5: false, $G6: false, $G7: false, $G8: false, - $G9: false, $G10: false) { + $G9: false, $G10: false, + $fallback: false) { // Detect what type of value exists in $pos $pos-type: type-of(nth($pos, 1)); @@ -15,7 +16,15 @@ $full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10); - background-color: nth($G1, 1); + // Set $G1 as the default fallback color + $fallback-color: nth($G1, 1); + + // If $fallback is a color use that color as the fallback color + @if type-of($fallback) == color { + $fallback-color: $fallback; + } + + background-color: $fallback-color; background-image: deprecated-webkit-gradient(linear, $full); // Safari <= 5.0 background-image: -webkit-linear-gradient($pos, $full); // Safari 5.1+, Chrome background-image: -moz-linear-gradient($pos, $full); @@ -27,5 +36,6 @@ // Usage: Gradient position is optional, default is top. Position can be a degree. Color stops are optional as well. // @include linear-gradient(#1e5799, #2989d8); +// @include linear-gradient(#1e5799, #2989d8, $fallback:#2989d8); // @include linear-gradient(top, #1e5799 0%, #2989d8 50%); // @include linear-gradient(50deg, rgba(10, 10, 10, 0.5) 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%); diff --git a/sass/bourbon/functions/_golden-ratio.scss b/sass/bourbon/functions/_golden-ratio.scss deleted file mode 100644 index 8f825addf3..0000000000 --- a/sass/bourbon/functions/_golden-ratio.scss +++ /dev/null @@ -1,31 +0,0 @@ -@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 diff --git a/bourbon/functions/_modular-scale.scss b/sass/bourbon/functions/_modular-scale.scss similarity index 100% rename from bourbon/functions/_modular-scale.scss rename to sass/bourbon/functions/_modular-scale.scss diff --git a/sass/bourbon/lib/bourbon.rb b/sass/bourbon/lib/bourbon.rb index ca440eefbc..1635be836d 100644 --- a/sass/bourbon/lib/bourbon.rb +++ b/sass/bourbon/lib/bourbon.rb @@ -1,3 +1,5 @@ +require "bourbon/generator" + module Bourbon if defined?(Rails) class Engine < ::Rails::Engine diff --git a/sass/_courseware.scss b/sass/courseware/_courseware.scss similarity index 67% rename from sass/_courseware.scss rename to sass/courseware/_courseware.scss index 489657459f..65c71fc183 100644 --- a/sass/_courseware.scss +++ b/sass/courseware/_courseware.scss @@ -5,84 +5,6 @@ div.course-wrapper { list-style: none; } - div#accordion { - @extend .sidebar; - - div#open_close_accordion { - position: absolute; - right: 0px; - width: 20px; - height: 20px; - background: #ccc; - border: 1px solid black; - right: -22px; - top: 5px; - } - - h3 { - overflow: hidden; - margin: 0; - - &:last-child { - @include box-shadow(none); - } - - &.ui-accordion-header { - color: #000; - - a { - font-size: $body-font-size; - color: lighten($text-color, 10%); - } - - &.ui-state-hover { - border: none; - border-bottom: 1px solid #d3d3d3; - } - - &.ui-state-active { - @extend .active; - } - } - } - - ul.ui-accordion-content { - @include border-radius(0); - @include box-shadow( inset -1px 0 0 #e6e6e6); - background: #d6d6d6; - border: none; - border-bottom: 1px solid #c3c3c3; - font-size: 12px; - margin: 0; - overflow: hidden; - - li { - &.active { - font-weight: bold; - } - - a { - text-decoration: none; - margin-bottom: lh(.5); - display: block; - color: #000; - - &:hover { - color: #666; - } - - p { - margin-bottom: 0; - - &.subtitle { - color: #666; - } - } - } - } - } - } - section.course-content { @extend .content; diff --git a/sass/_courseware-sequence-nav.scss b/sass/courseware/_sequence-nav.scss similarity index 100% rename from sass/_courseware-sequence-nav.scss rename to sass/courseware/_sequence-nav.scss diff --git a/sass/courseware/_sidebar.scss b/sass/courseware/_sidebar.scss new file mode 100644 index 0000000000..401a2f5c3c --- /dev/null +++ b/sass/courseware/_sidebar.scss @@ -0,0 +1,77 @@ +div#accordion { + @extend .sidebar; + + div#open_close_accordion { + position: absolute; + right: 0px; + width: 20px; + height: 20px; + background: #ccc; + border: 1px solid black; + right: -22px; + top: 5px; + } + + h3 { + overflow: hidden; + margin: 0; + + &:last-child { + @include box-shadow(none); + } + + &.ui-accordion-header { + color: #000; + + a { + font-size: $body-font-size; + color: lighten($text-color, 10%); + } + + &.ui-state-hover { + border: none; + border-bottom: 1px solid #d3d3d3; + } + + &.ui-state-active { + @extend .active; + } + } + } + + ul.ui-accordion-content { + @include border-radius(0); + @include box-shadow( inset -1px 0 0 #e6e6e6); + background: #d6d6d6; + border: none; + border-bottom: 1px solid #c3c3c3; + font-size: 12px; + margin: 0; + overflow: hidden; + + li { + &.active { + font-weight: bold; + } + + a { + text-decoration: none; + margin-bottom: lh(.5); + display: block; + color: #000; + + &:hover { + color: #666; + } + + p { + margin-bottom: 0; + + &.subtitle { + color: #666; + } + } + } + } + } +} diff --git a/sass/_courseware-video.scss b/sass/courseware/_video.scss similarity index 100% rename from sass/_courseware-video.scss rename to sass/courseware/_video.scss diff --git a/sass/_discussion-answers.scss b/sass/discussion/_answers.scss similarity index 100% rename from sass/_discussion-answers.scss rename to sass/discussion/_answers.scss diff --git a/sass/_askbot-original.scss b/sass/discussion/_askbot-original.scss similarity index 100% rename from sass/_askbot-original.scss rename to sass/discussion/_askbot-original.scss diff --git a/sass/_discussion.scss b/sass/discussion/_discussion.scss similarity index 100% rename from sass/_discussion.scss rename to sass/discussion/_discussion.scss diff --git a/sass/_form-wmd-toolbar.scss b/sass/discussion/_form-wmd-toolbar.scss similarity index 100% rename from sass/_form-wmd-toolbar.scss rename to sass/discussion/_form-wmd-toolbar.scss diff --git a/sass/_discussion-forms.scss b/sass/discussion/_forms.scss similarity index 100% rename from sass/_discussion-forms.scss rename to sass/discussion/_forms.scss diff --git a/sass/_question-view.scss b/sass/discussion/_question-view.scss similarity index 100% rename from sass/_question-view.scss rename to sass/discussion/_question-view.scss diff --git a/sass/_discussion-questions.scss b/sass/discussion/_questions.scss similarity index 100% rename from sass/_discussion-questions.scss rename to sass/discussion/_questions.scss diff --git a/sass/_discussion-tags.scss b/sass/discussion/_tags.scss similarity index 100% rename from sass/_discussion-tags.scss rename to sass/discussion/_tags.scss diff --git a/sass/index/_base.scss b/sass/index/_base.scss new file mode 100644 index 0000000000..c2a5b9dcc2 --- /dev/null +++ b/sass/index/_base.scss @@ -0,0 +1,44 @@ +body { + background-color: #fff; + color: #444; + font: $body-font-size $body-font-family; + + :focus { + outline-color: #ccc; + } + + h1 { + font: 800 24px $header-font-family; + } + + li { + margin-bottom: lh(); + } + + em { + font-style: italic; + } + + a { + color: $mit-red; + font-style: italic; + text-decoration: none; + + &:hover, &:focus { + color: darken($mit-red, 10%); + } + } + + #{$all-text-inputs}, textarea { + @include box-shadow(0 -1px 0 #fff); + @include linear-gradient(#eee, #fff); + border: 1px solid #999; + font: $body-font-size $body-font-family; + padding: 4px; + width: 100%; + + &:focus { + border-color: $mit-red; + } + } +} diff --git a/sass/_index-extends.scss b/sass/index/_extends.scss similarity index 100% rename from sass/_index-extends.scss rename to sass/index/_extends.scss diff --git a/sass/index/_footer.scss b/sass/index/_footer.scss new file mode 100644 index 0000000000..ee62b69426 --- /dev/null +++ b/sass/index/_footer.scss @@ -0,0 +1,47 @@ +footer { + @extend .wrapper; + @extend .clearfix; + padding-top: 0; + + div.footer-wrapper { + border-top: 1px solid #e5e5e5; + padding: lh() 0; + background: url('/static/images/marketing/mit-logo.png') right center no-repeat; + + a { + color: #888; + text-decoration: none; + @include transition(); + + &:hover, &:focus { + color: #666; + } + } + + p { + @include inline-block(); + margin-right: lh(); + } + + ul { + @include inline-block(); + + li { + @include inline-block(); + + &:after { + content: ' |'; + display: inline; + color: #ccc; + } + + &:last-child { + &:after { + content: none; + } + } + + } + } + } +} diff --git a/sass/index/_header.scss b/sass/index/_header.scss new file mode 100644 index 0000000000..e5e8a12cdd --- /dev/null +++ b/sass/index/_header.scss @@ -0,0 +1,144 @@ +header.announcement { + @include background-size(cover); + background: #333; + border-bottom: 1px solid #000; + color: #fff; + -webkit-font-smoothing: antialiased; + + &.home { + background: #e3e3e3 url("/static/images/marketing/shot-5-medium.jpg"); + + @media screen and (min-width: 1200px) { + background: #e3e3e3 url("/static/images/marketing/shot-5-large.jpg"); + } + + div { + padding: lh(10) lh() lh(3); + + //hide login link for homepage + nav { + h1 { + margin-right: 0; + } + + a.login { + display: none; + } + } + } + } + + &.course { + background: #e3e3e3 url("/static/images/marketing/course-bg-small.jpg"); + + @media screen and (min-width: 1200px) { + background: #e3e3e3 url("/static/images/marketing/course-bg-large.jpg"); + } + + @media screen and (max-width: 1199px) and (min-width: 700px) { + background: #e3e3e3 url("/static/images/marketing/course-bg-medium.jpg"); + } + + div { + padding: lh(4) lh() lh(2); + } + } + + div { + @extend .wrapper; + position: relative; + + nav { + position: absolute; + top: 0; + right: lh(); + @include border-radius(0 0 3px 3px); + background: #333; + background: rgba(#000, .7); + padding: lh(.5) lh(); + + h1 { + @include inline-block(); + margin-right: lh(.5); + + a { + font: italic 800 18px $header-font-family; + color: #fff; + text-decoration: none; + + &:hover, &:focus { + color: #999; + } + } + } + + a.login { + text-decoration: none; + color: #fff; + font-size: 12px; + font-style: normal; + font-family: $header-font-family; + + &:hover, &:focus { + color: #999; + } + } + } + + section { + @extend .clearfix; + @include inline-block(); + background: $mit-red; + margin-left: flex-grid(4) + flex-gutter(); + padding: lh() lh(1.5); + + h1 { + @include inline-block(); + font-family: "Open Sans"; + font-size: 30px; + font-weight: 800; + line-height: 1.2em; + margin: 0 lh() 0 0; + } + + h2 { + @include inline-block(); + font-family: "Open Sans"; + font-size: 24px; + font-weight: 400; + line-height: 1.2em; + } + + &.course { + section { + width: flex-grid(4, 8); + margin-right: flex-gutter(8); + float: left; + margin-left: 0; + padding: 0; + + a { + @extend .button; + @include box-shadow(inset 0 1px 0 darken($mit-red, 10%), 0 1px 0 lighten($mit-red, 5%)); + background-color: darken($mit-red, 20%); + display: block; + padding: lh(.5) lh(); + border-color: darken($mit-red, 30%); + text-align: center; + + &:hover { + background-color: darken($mit-red, 10%); + border-color: darken($mit-red, 20%); + } + } + } + + p { + width: flex-grid(4, 8); + line-height: lh(); + float: left; + } + } + } + } +} diff --git a/sass/index/_index.scss b/sass/index/_index.scss new file mode 100644 index 0000000000..b24eee663e --- /dev/null +++ b/sass/index/_index.scss @@ -0,0 +1,233 @@ +section.index-content { + @extend .wrapper; + @extend .clearfix; + + section { + @extend .clearfix; + float: left; + + h1 { + font-size: 800 24px "Open Sans"; + margin-bottom: lh(); + } + + p { + line-height: lh(); + margin-bottom: lh(); + } + + ul { + margin: 0; + } + + &.about { + @include box-sizing(border-box); + border-right: 1px solid #e5e5e5; + margin-right: flex-gutter(); + padding-right: flex-gutter() / 2; + width: flex-grid(8); + + section { + @extend .clearfix; + margin-bottom: lh(); + + p { + width: flex-grid(4, 8); + float: left; + + &:nth-child(odd) { + margin-right: flex-gutter(8); + } + } + + &.intro { + section { + margin-bottom: 0; + + &.intro-text { + margin-right: flex-gutter(8); + width: flex-grid(4, 8); + + p { + margin-right: 0; + width: auto; + float: none; + } + } + + &.intro-video { + width: flex-grid(4, 8); + + a { + display: block; + width: 100%; + + img { + width: 100%; + } + + span { + display: none; + } + } + } + } + } + + &.features { + border-top: 1px solid #E5E5E5; + padding-top: lh(); + margin-bottom: 0; + + h2 { + text-transform: uppercase; + letter-spacing: 1px; + color: #666; + margin-bottom: lh(); + + span { + text-transform: none; + } + } + + p { + width: auto; + clear: both; + + strong { + font-family: "Open sans"; + font-weight: 800; + } + + a { + color: $mit-red; + text-decoration: none; + @include transition(); + + &:hover, &:focus { + color: darken($mit-red, 15%); + } + } + } + + ul { + margin-bottom: 0; + + li { + line-height: lh(); + width: flex-grid(4, 8); + float: left; + margin-bottom: lh(.5); + + &:nth-child(odd) { + margin-right: flex-gutter(8); + } + } + } + } + } + } + + &.course, &.staff { + width: flex-grid(4); + + h1 { + font: normal $body-font-size $body-font-family; + text-transform: uppercase; + letter-spacing: 1px; + color: #666; + margin-bottom: lh(); + } + + h2 { + font: 800 24px $header-font-family; + } + + h3 { + font: 400 18px $header-font-family; + } + + a { + @extend .button; + } + + ul { + list-style: none; + + li { + img { + float: left; + margin-right: lh(.5); + } + } + } + } + + &.course { + h2 { + padding-top: lh(5); + background: url('/static/images/marketing/circuits-bg.jpg') 0 0 no-repeat; + @include background-size(contain); + + @media screen and (max-width: 998px) { + background: url('/static/images/marketing/circuits-medium-bg.jpg') 0 0 no-repeat; + } + } + } + + + // index + //---------------------------------------- // + &.about-course { + @include box-sizing(border-box); + border-right: 1px solid #e5e5e5; + margin-right: flex-gutter(); + padding-right: flex-gutter() / 2; + width: flex-grid(8); + + section { + width: flex-grid(4, 8); + + + &.about-info { + margin-right: flex-gutter(8); + } + + &.requirements { + clear: both; + width: 100%; + border-top: 1px solid #E5E5E5; + padding-top: lh(); + margin-bottom: 0; + + p { + float: left; + width: flex-grid(4, 8); + margin-right: flex-gutter(8); + + &:nth-child(odd) { + margin-right: 0; + } + } + } + + &.cta { + width: 100%; + text-align: center; + + a.enroll { + @extend .button; + padding: lh(.5) lh(2); + @include inline-block(); + text-align: center; + font: 800 18px $header-font-family; + } + } + } + } + } +} + +section.copyright, section.tos, section.privacy-policy, section.honor-code { + @extend .subpage; +} diff --git a/sass/_index-variables.scss b/sass/index/_variables.scss similarity index 69% rename from sass/_index-variables.scss rename to sass/index/_variables.scss index 47eb6b9179..7f3deac55e 100644 --- a/sass/_index-variables.scss +++ b/sass/index/_variables.scss @@ -13,15 +13,17 @@ $gw-gutter: 25px; $body-font-family: Georgia, serif; $header-font-family: "Open Sans", Helvetica, Arial, sans-serif; -// @media screen and (min-width: 940px) { - $body-font-size: 16px; +$body-font-size: 16px; + +// @media screen and (min-width:1200px) { +// $body-font-size: 18px; // } - -// @media screen and (max-width: 939px) { +// @media screen and (max-width:890px) { // $body-font-size: 14px; // } +$body-line-height: golden-ratio($body-font-size, 1); $lh: golden-ratio($body-font-size, 1); // Colors diff --git a/sass/layout/_footer.scss b/sass/layout/_footer.scss new file mode 100644 index 0000000000..97c28d5fd8 --- /dev/null +++ b/sass/layout/_footer.scss @@ -0,0 +1,45 @@ +footer { + @extend .clearfix; + @extend .wrapper; + @include box-sizing(border-box); + color: #777; + margin-top: $body-line-height; + padding: 0 $body-line-height; + + p { + float: left; + + a { + color: #444; + + &:link, &:visited { + color: #444; + } + + &:hover, &:focus { + color: #000; + } + } + } + + ul { + float: right; + + li { + display: inline-block; + margin-right: 20px; + + a { + color: #444; + + &:link, &:visited { + color: #444; + } + + &:hover, &:focus { + color: #000; + } + } + } + } +} diff --git a/sass/layout/_header.scss b/sass/layout/_header.scss new file mode 100644 index 0000000000..5d3cf5a048 --- /dev/null +++ b/sass/layout/_header.scss @@ -0,0 +1,103 @@ +div.header-wrapper { + // @include linear-gradient(lighten($mit-red, 5%), darken($mit-red, 5%)); + @include box-shadow(inset 0 -1px 2px darken($mit-red, 10%)); + background: $mit-red; + border-bottom: 1px solid #fff; + + header { + @extend .clearfix; + @extend .wrapper; + @include box-sizing(border-box); + padding: 0 $body-line-height; + + hgroup { + @extend .clearfix; + float: left; + + h1 { + border-right: 1px solid darken($mit-red, 5%); + color: darken($mit-red, 25%); + font-size: 20px; + font-weight: 800; + margin: 0 lh() 0 0; + padding: 17px lh() 14px 0; + text-shadow: 0 1px 0 lighten($mit-red, 10%); + line-height: lh(); + @include inline-block(); + } + + h2 { + @include inline-block(); + margin: 0 lh() 0 0; + padding: 19px lh() 9px 0; + line-height: lh(); + border-right: 1px solid darken($mit-red, 5%); + -webkit-font-smoothing: antialiased; + + a { + color: #fff; + text-decoration: none; + + &:hover { + color: rgba(#fff, .7); + } + } + } + + @media screen and (max-width: 920px) { + border-bottom: 1px solid darken($mit-red, 5%); + display: block; + float: none; + + h1 { + float: right; + border: 0; + margin-right: 0; + padding-right: 0; + } + + h2 { + float: left; + border: 0; + margin-right: 0; + padding-right: 0; + } + } + } + + nav { + float: left; + display: block; + margin: 0; + padding: 0; + text-shadow: 0 -1px 0 darken($mit-red, 10%); + -webkit-font-smoothing: antialiased; + + + ul { + @extend .clearfix; + display: inline-block; + padding: 19px 0 9px; + margin: 0; + + li { + margin-right: lh(); + display: inline-block; + margin-bottom: 0; + line-height: lh(); + + a { + color: #fff; + text-decoration: none; + + &:hover { + color: rgba(#fff, .7); + background-color: none; + text-decoration: none; + } + } + } + } + } + } +} diff --git a/sass/layout/_layout.scss b/sass/layout/_layout.scss new file mode 100644 index 0000000000..c0f52ad268 --- /dev/null +++ b/sass/layout/_layout.scss @@ -0,0 +1,28 @@ +html { + margin-top: 0; + + body { + color: $dark-gray; + font: $body-font-size $body-font-family; + text-align: center; + margin: 0; + background: #f4f4f4; //#f3f1e5 + + section.main-content { + @extend .clearfix; + @extend .wrapper; + @include box-sizing(border-box); + @include border-radius(4px); + overflow: hidden; + background: #fff; + border-bottom: 1px solid #bbb; + + @media screen and (min-width: 1400px) { + // @include border-radius(3px); + @include box-shadow(0 0 4px #dfdfdf); + border: 1px solid #bbb; + margin-top: lh(.5); + } + } + } +} diff --git a/sass/_leanmodal.scss b/sass/layout/_leanmodal.scss similarity index 100% rename from sass/_leanmodal.scss rename to sass/layout/_leanmodal.scss diff --git a/sass/marketing.scss b/sass/marketing.scss index 61dff2d197..7b93c36a3b 100644 --- a/sass/marketing.scss +++ b/sass/marketing.scss @@ -1,7 +1,6 @@ @import "bourbon/bourbon"; -@import "reset"; -@import "font-face"; +@import "base/reset", "base/font-face", "base/functions"; // pages -@import "index-functions", "index-variables", "index-extends", "index"; -@import "leanmodal"; +@import "index/variables", "index/extends", "index/base", "index/header", "index/footer", "index/index"; +@import "layout/leanmodal"; diff --git a/sass/print.scss b/sass/print.scss new file mode 100644 index 0000000000..12436ba683 --- /dev/null +++ b/sass/print.scss @@ -0,0 +1,6 @@ +.header-wrapper {display:none;} +#accordion {display:none;} +.ui-accordion {display:none; +visibility:hidden; +width:0%; +} diff --git a/sass/_wiki-basic-html.scss b/sass/wiki/_basic-html.scss similarity index 100% rename from sass/_wiki-basic-html.scss rename to sass/wiki/_basic-html.scss diff --git a/sass/_wiki-create.scss b/sass/wiki/_create.scss similarity index 100% rename from sass/_wiki-create.scss rename to sass/wiki/_create.scss diff --git a/sass/wiki/_sidebar.scss b/sass/wiki/_sidebar.scss new file mode 100644 index 0000000000..513b3c2556 --- /dev/null +++ b/sass/wiki/_sidebar.scss @@ -0,0 +1,69 @@ +div#wiki_panel { + @extend .sidebar; + overflow: auto; + + input[type="button"] { + @extend h3; + @include transition(); + color: lighten($text-color, 10%); + font-size: $body-font-size; + margin: 0 !important; + padding: 7px lh(); + text-align: left; + width: 100%; + + &:hover { + @include box-shadow(0 1px 0 #fff); + background: #efefef; + } + } + + ul { + li { + &.search { + @include box-shadow(0 1px 0 #eee); + border-bottom: 1px solid #d3d3d3; + padding: 7px lh(); + + label { + display: none; + } + } + + &.create-article { + h3 { + a { + padding: 7px lh(); + } + } + } + } + } + + div#wiki_create_form { + @extend .clearfix; + padding: 15px; + background: #d6d6d6; + border-bottom: 1px solid #bbb; + + input[type="text"] { + margin-bottom: 6px; + display: block; + width: 100%; + @include box-sizing(border-box); + } + + ul { + list-style: none; + + li { + float: left; + + &#cancel { + float: right; + margin-top: 10px; + } + } + } + } +} diff --git a/sass/_wiki.scss b/sass/wiki/_wiki.scss similarity index 53% rename from sass/_wiki.scss rename to sass/wiki/_wiki.scss index 86b90c43d6..8078273514 100644 --- a/sass/_wiki.scss +++ b/sass/wiki/_wiki.scss @@ -2,76 +2,6 @@ div.wiki-wrapper { display: table; width: 100%; - div#wiki_panel { - @extend .sidebar; - overflow: auto; - - input[type="button"] { - @extend h3; - @include transition(); - color: lighten($text-color, 10%); - font-size: $body-font-size; - margin: 0 !important; - padding: 7px lh(); - text-align: left; - width: 100%; - - &:hover { - @include box-shadow(0 1px 0 #fff); - background: #efefef; - } - } - - ul { - li { - &.search { - @include box-shadow(0 1px 0 #eee); - border-bottom: 1px solid #d3d3d3; - padding: 7px lh(); - - label { - display: none; - } - } - - &.create-article { - h3 { - a { - padding: 7px lh(); - } - } - } - } - } - - div#wiki_create_form { - @extend .clearfix; - padding: 15px; - background: #d6d6d6; - border-bottom: 1px solid #bbb; - - input[type="text"] { - margin-bottom: 6px; - display: block; - width: 100%; - @include box-sizing(border-box); - } - - ul { - list-style: none; - - li { - float: left; - - &#cancel { - float: right; - margin-top: 10px; - } - } - } - } - } - section.wiki-body { @extend .content; From 92f2927fe53c4ab1ef7a8b60cbea1acb178cad69 Mon Sep 17 00:00:00 2001 From: Reda Lemeden Date: Tue, 14 Feb 2012 13:57:16 -0500 Subject: [PATCH 43/46] Redesigned the question tag filtering & navigation --- sass/_discussion-questions.scss | 125 ++++++++++++++------------------ 1 file changed, 55 insertions(+), 70 deletions(-) diff --git a/sass/_discussion-questions.scss b/sass/_discussion-questions.scss index eb0d0aedf3..d508ba6161 100644 --- a/sass/_discussion-questions.scss +++ b/sass/_discussion-questions.scss @@ -4,93 +4,45 @@ div.question-list-header { overflow: hidden; width: flex-grid(9,9); - section.question-list-meta, section.question-sort-filter { + section.question-list-meta { display: block; overflow: hidden; width: 100%; div { - display: inline; + display: inline-block; float: left; } - } - section.question-list-meta { + span.label { + color: #555; + } + div.question-list-title { margin-right: flex-gutter(); - // width: flex-grid(3,9); h1 { margin-top: 0; } } - div.question-list-tags { - // width: flex-grid(6,9); - padding-top:8px; - - ul.tags { - display: inline; - // float: left; - - li { - span.delete-icon, div.delete-icon { - @include border-radius(0 4px 4px 0); - background: #555; - color: #eee; - cursor: pointer; - float: none; - left: 10px; - padding: 3px 6px; - position: relative; - top: 1px; - opacity: 0.5; - - &:hover { - opacity: 1; - } - } - } - } - } - } - section.question-sort-filter { - font-size: 16px; - - span.label { - color: #555; - } - - div.question-filter { - margin-right: flex-gutter(9); - - ul.scope-filters { - @extend .action-link; - - li { - display: inline; - - a { - &.on { - font-weight: bold; - } - - &:before { - content: '|'; - color: darken(#F6EFD4, 10%); - font-size: 22px; - } - } - } - } - } div.question-sort { - margin-left: flex-gutter(); float: right; + margin-left: flex-gutter(); + // width: flex-grid(3,9); + + // @media screen and (max-width: 1300px) { + // width: 100%; + // } nav { @extend .action-link; + float: right; + + // @media screen and (max-width: 1300px) { + // float: left; + // } a { &.on span{ @@ -107,9 +59,46 @@ div.question-list-header { } } + section.question-tags-list { + display: block; + min-height: 40px; + overflow: hidden; + width: 100%; + + div.tags-list { + padding-top:8px; + display: inline-block; + float: left; + + ul.tags { + display: inline; + + li { + span.delete-icon, div.delete-icon { + @include border-radius(0 4px 4px 0); + background: #555; + color: #eee; + cursor: pointer; + float: none; + display: inline; + clear: none; + left: 10px; + padding: 3px 6px; + position: relative; + top: 1px; + opacity: 0.5; + + &:hover { + opacity: 1; + } + } + } + } + } + } } -ul.question-list { +ul.question-list, div#question-list { width: flex-grid(9,9); li.single-question { @@ -208,9 +197,5 @@ ul.question-list { } } -div.search-tips { - display: block; -} - .search-result-summary { } From 3a25e96a2c8c6212976937841265c762bf5f21bd Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Tue, 14 Feb 2012 14:35:49 -0500 Subject: [PATCH 44/46] Fixed padding on discussions --- sass/discussion/_discussion.scss | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/sass/discussion/_discussion.scss b/sass/discussion/_discussion.scss index 111d23bff0..14602f897d 100644 --- a/sass/discussion/_discussion.scss +++ b/sass/discussion/_discussion.scss @@ -38,9 +38,9 @@ body.askbot { div.discussion-content { @include box-sizing(border-box); display: table-cell; - padding: $gw-gutter; + padding: lh(); vertical-align: top; - width: flex-grid(9); + width: flex-grid(9) + flex-gutter(); p.tabula-rasa { @include border-radius(5px); @@ -72,7 +72,7 @@ body.askbot { @include border-radius(0 4px 4px 0); border-left: 1px solid #d3d3d3; border-right: 1px solid #f6f6f6; - padding: $gw-gutter; + padding: lh(); width: flex-grid(3); h2 { From f1fc649eee0e8a5eb2c1f9e5d8c0114018faa2c1 Mon Sep 17 00:00:00 2001 From: kaishin Date: Tue, 14 Feb 2012 15:24:31 -0500 Subject: [PATCH 45/46] Fixed the tag div properties --- sass/discussion/_questions.scss | 26 ++++++++++++++------------ 1 file changed, 14 insertions(+), 12 deletions(-) diff --git a/sass/discussion/_questions.scss b/sass/discussion/_questions.scss index d508ba6161..5a2780853c 100644 --- a/sass/discussion/_questions.scss +++ b/sass/discussion/_questions.scss @@ -30,20 +30,11 @@ div.question-list-header { div.question-sort { float: right; margin-left: flex-gutter(); - // width: flex-grid(3,9); - - // @media screen and (max-width: 1300px) { - // width: 100%; - // } nav { @extend .action-link; float: right; - // @media screen and (max-width: 1300px) { - // float: left; - // } - a { &.on span{ font-weight: bold; @@ -61,14 +52,25 @@ div.question-list-header { section.question-tags-list { display: block; - min-height: 40px; + min-height: 26px; overflow: hidden; + padding-top:5px; width: 100%; - div.tags-list { - padding-top:8px; + div { display: inline-block; float: left; + } + + div.back { + margin-right: 10px; + + a { + color: #555; + } + } + + div.tags-list { ul.tags { display: inline; From de3fd877e50bd010ccdf0a4bc264c3928a22ce3d Mon Sep 17 00:00:00 2001 From: Kyle Fiedler Date: Wed, 15 Feb 2012 09:32:23 -0500 Subject: [PATCH 46/46] Fixed header bug and calculator bug in firefox --- sass/layout/_header.scss | 1 + sass/layout/_leanmodal.scss | 4 ++-- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/sass/layout/_header.scss b/sass/layout/_header.scss index 5d3cf5a048..144194e397 100644 --- a/sass/layout/_header.scss +++ b/sass/layout/_header.scss @@ -71,6 +71,7 @@ div.header-wrapper { margin: 0; padding: 0; text-shadow: 0 -1px 0 darken($mit-red, 10%); + max-height: 52px; //fix for firefox -webkit-font-smoothing: antialiased; diff --git a/sass/layout/_leanmodal.scss b/sass/layout/_leanmodal.scss index 9e754377e2..730ea7b764 100644 --- a/sass/layout/_leanmodal.scss +++ b/sass/layout/_leanmodal.scss @@ -221,7 +221,6 @@ div#feedback_div{ div#calculator_div { max-width: 500px; - form { padding-bottom: lh(); margin-bottom: lh(); @@ -246,11 +245,12 @@ div#calculator_div { input#calculator_output { border: 0; - background: 0; + background: none; padding: lh(.35); width: 60px; font-size: 24px; font-weight: bold; + margin-top: 4px; } }