Skip to content

E
edx-platform
Commit 35c5de81 by Galen Frechette
Options

cleans up home page header design, adds social sharing to header, adds tos,… 

cleans up home page header design, adds social sharing to header, adds tos, privacy policy, honor code, help and copyright pages, add liks to those pages in footer, finished contact page
parent 1ea8bd26
Showing with 603 additions and 288 deletions
lms/djangoapps/static_template_view/views.py
...@@ -13,6 +13,7 @@ valid_templates=['index.html', ...@@ -13,6 +13,7 @@ valid_templates=['index.html',
'tos.html', 'tos.html',
'privacy.html', 'privacy.html',
'honor.html', 'honor.html',
'help.html',
'copyright.html', 'copyright.html',
'404.html', '404.html',
'mitx_help.html', 'mitx_help.html',
...@@ -20,10 +21,9 @@ valid_templates=['index.html', ...@@ -20,10 +21,9 @@ valid_templates=['index.html',
'about.html', 'about.html',
'faq.html', 'faq.html',
'press.html', 'press.html',
'contact.html', 'contact.html']
'terms_and_conditions.html']
if settings.STATIC_GRAB: if settings.STATIC_GRAB:
valid_templates = valid_templates+['server-down.html', valid_templates = valid_templates+['server-down.html',
'server-error.html' 'server-error.html'
'server-overloaded.html', 'server-overloaded.html',
...@@ -33,7 +33,7 @@ if settings.STATIC_GRAB: ...@@ -33,7 +33,7 @@ if settings.STATIC_GRAB:
'6002x-press-release.html' '6002x-press-release.html'
] ]
def index(request, template): def index(request, template):
csrf_token = csrf(request)['csrf_token'] csrf_token = csrf(request)['csrf_token']
if template in valid_templates: if template in valid_templates:
return render_to_response(template, {'error' : '', return render_to_response(template, {'error' : '',
...@@ -43,7 +43,7 @@ def index(request, template): ...@@ -43,7 +43,7 @@ def index(request, template):
valid_auth_templates=['help.html'] valid_auth_templates=['help.html']
def auth_index(request, template): def auth_index(request, template):
if not request.user.is_authenticated(): if not request.user.is_authenticated():
return redirect('/') return redirect('/')
......
lms/static/sass/_about.scss
...@@ -194,14 +194,32 @@ ...@@ -194,14 +194,32 @@
.map { .map {
background: rgb(245,245,245); background: rgb(245,245,245);
float: left; float: left;
height: 180px; height: 280px;
margin-right: flex-gutter(); margin-right: flex-gutter();
overflow: hidden;
width: flex-grid(6); width: flex-grid(6);
img {
min-height: 100%;
max-width: 100%;
}
} }
.address { .contacts {
@include box-sizing(border-box);
float: left; float: left;
padding-left: 40px;
width: flex-grid(6); width: flex-grid(6);
ul {
list-style: none;
margin: 0px;
padding: 0px;
li {
margin-bottom: 10px;
}
}
} }
} }
} }
lms/static/sass/_base.scss
...@@ -43,19 +43,17 @@ h2 { ...@@ -43,19 +43,17 @@ h2 {
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
} }
p + h2, ul + h2, ol + h2 {
margin-top: 40px;
}
p { p {
color: $base-font-color; color: $base-font-color;
font: normal 1.3rem/2rem $serif; font: normal 1.3rem/2rem $serif;
margin: 0px; margin: 0px;
} }
span { p + p, ul + p, ol + p {
color: $lighter-base-font-color;
font: normal 1.3rem/2rem $sans-serif;
margin: 0px;
}
p + p {
margin-top: 20px; margin-top: 20px;
} }
...@@ -96,3 +94,42 @@ a:link, a:visited { ...@@ -96,3 +94,42 @@ a:link, a:visited {
max-width: 1200px; max-width: 1200px;
width: flex-grid(12); width: flex-grid(12);
} }
.static-container {
@include clearfix;
margin: 0 auto 0;
max-width: 1200px;
padding: 60px 0px 120px;
width: flex-grid(12);
.inner-wrapper {
margin: 0 auto 0;
width: flex-grid(10);
}
ol, ul {
list-style: disc;
li {
color: $base-font-color;
font: normal 1.3rem/2rem $serif;
margin: 0px;
}
}
h1 {
margin-bottom: 30px;
}
h1 + hr {
margin-bottom: 60px;
}
p + h2, ul + h2, ol + h2 {
margin-top: 40px;
}
ul + p, ol + p {
margin-top: 20px;
}
}
lms/static/sass/_base_animations.scss
// home-header-pop-up animation
//************************************************************************//
.animation-home-header-pop-up {
@include animation(home-header-pop-up 1.25s ease-in-out);
@include animation-fill-mode(both);
@include animation-delay(1s);
}
@mixin home-header-pop-up-keyframes {
0% {
//opacity: 0;
top: 300px;
//@include transform(scale(0.9));
}
65% {
//opacity: 1;
top: -40px;
//@include transform(scale(1));
}
85% {
top: 10px;
}
100% {
top: 0px;
}
}
@-webkit-keyframes home-header-pop-up { @include home-header-pop-up-keyframes; }
@-moz-keyframes home-header-pop-up { @include home-header-pop-up-keyframes; }
@keyframes home-header-pop-up { @include home-header-pop-up-keyframes; }
// title appear animation // title appear animation
//************************************************************************// //************************************************************************//
......
lms/static/sass/_course_info.scss
...@@ -7,7 +7,6 @@ ...@@ -7,7 +7,6 @@
background: rgb(245,245,245); background: rgb(245,245,245);
@include background-image(url('/static/images/shot-2-large.jpg')); @include background-image(url('/static/images/shot-2-large.jpg'));
background-size: cover; background-size: cover;
//@include background-image(linear-gradient(-90deg, rgb(230,230,230), rgb(245,245,245)));
@include box-shadow(0 1px 80px 0 rgba(0,0,0, 0.5)); @include box-shadow(0 1px 80px 0 rgba(0,0,0, 0.5));
border-bottom: 1px solid rgb(100,100,100); border-bottom: 1px solid rgb(100,100,100);
@include box-shadow(inset 0 1px 5px 0 rgba(0,0,0, 0.1)); @include box-shadow(inset 0 1px 5px 0 rgba(0,0,0, 0.1));
...@@ -122,6 +121,7 @@ ...@@ -122,6 +121,7 @@
} }
.media { .media {
background: #fff;
border-left: 1px solid rgb(100,100,100); border-left: 1px solid rgb(100,100,100);
@include box-sizing(border-box); @include box-sizing(border-box);
float: right; float: right;
...@@ -163,7 +163,8 @@ ...@@ -163,7 +163,8 @@
} }
img { img {
min-width: 100%; display: block;
width: 100%;
} }
} }
......
lms/static/sass/_dashboard.scss
...@@ -64,30 +64,41 @@ ...@@ -64,30 +64,41 @@
margin: 0px; margin: 0px;
width: flex-grid(9); width: flex-grid(9);
> header {
border-bottom: 1px solid rgb(210,210,210);
margin-bottom: 40px;
}
.empty-dashboard-message { .empty-dashboard-message {
border-top: 1px solid rgb(210,210,210);
padding: 80px 0px; padding: 80px 0px;
text-align: center; text-align: center;
p { p {
color: $lighter-base-font-color; color: $lighter-base-font-color;
font-style: italic; font-style: italic;
margin-bottom: 20px;
text-shadow: 0 1px rgba(255,255,255, 0.6); text-shadow: 0 1px rgba(255,255,255, 0.6);
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
}
a { a {
background: rgb(240,240,240); background: rgb(240,240,240);
@include background-image(linear-gradient(-90deg, rgb(245,245,245) 0%, rgb(243,243,243) 50%, rgb(237,237,237) 50%, rgb(235,235,235) 100%)); @include background-image(linear-gradient(-90deg, rgb(245,245,245) 0%, rgb(243,243,243) 50%, rgb(237,237,237) 50%, rgb(235,235,235) 100%));
border: 1px solid rgb(220,220,220); border: 1px solid rgb(220,220,220);
@include border-radius(4px); @include border-radius(4px);
@include box-shadow(0 1px 8px 0 rgba(0,0,0, 0.1)); @include box-shadow(0 1px 8px 0 rgba(0,0,0, 0.1));
@include box-sizing(border-box); @include box-sizing(border-box);
color: $base-font-color; color: $base-font-color;
font: 300 1.2rem/1.6rem $sans-serif; font: 300 1.2rem/1.6rem $sans-serif;
@include inline-block; @include inline-block;
margin-left: 5px; letter-spacing: 1px;
padding: 5px 10px; margin-left: 5px;
text-shadow: 0 1px rgba(255,255,255, 0.6); padding: 5px 10px;
text-shadow: 0 1px rgba(255,255,255, 0.6);
&:hover {
color: $blue;
//text-decoration: none;
} }
} }
} }
...@@ -179,7 +190,6 @@ ...@@ -179,7 +190,6 @@
> hgroup { > hgroup {
border-bottom: 1px solid rgb(210,210,210); border-bottom: 1px solid rgb(210,210,210);
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6)); @include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6));
margin-bottom: 20px;
padding: 15px 0px; padding: 15px 0px;
width: 100%; width: 100%;
...@@ -223,12 +233,35 @@ ...@@ -223,12 +233,35 @@
} }
} }
.course-status {
background: rgb(250,250,250);
border: 1px solid rgb(200,200,200);
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6));
margin-top: 14px;
padding: 5px;
p {
color: $lighter-base-font-color;
font: italic 300 1.2rem/1.4rem $sans-serif;
letter-spacing: 1px;
text-align: center;
text-transform: uppercase;
span {
color: $base-font-color;
font: italic 800 1.2rem/1.6rem $sans-serif;
}
}
}
.meta { .meta {
@include clearfix; @include clearfix;
margin-top: 19px;
position: relative; position: relative;
@include transition(opacity, 0.15s, linear); @include transition(opacity, 0.15s, linear);
width: 100%; width: 100%;
.course-work-icon { .course-work-icon {
background: rgb(200,200,200); background: rgb(200,200,200);
float: left; float: left;
......
lms/static/sass/_index.scss
...@@ -2,44 +2,274 @@ ...@@ -2,44 +2,274 @@
padding: 0px 0px 100px; padding: 0px 0px 100px;
> header { > header {
//background: rgb(250,250,250); background: rgb(255,255,255);
@include background-image(url('/static/images/shot-5-large.jpg')); @include background-image(url('/static/images/shot-2-large.jpg'));
background-size: cover; background-size: cover;
border-bottom: 1px solid rgb(80,80,80); border-bottom: 1px solid rgb(80,80,80);
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.9), inset 0 -1px 5px 0 rgba(0,0,0, 0.1)); @include box-shadow(0 1px 0 0 rgba(255,255,255, 0.9), inset 0 -1px 5px 0 rgba(0,0,0, 0.1));
@include clearfix; @include clearfix;
margin-top: -69px; margin-top: -69px;
min-height: 300px; overflow: hidden;
padding: 129px 0px 50px; padding: 149px 0px 90px;
width: flex-grid(12); width: flex-grid(12);
.inner-wrapper { .outer-wrapper {
@extend .animation-home-header-pop-up;
max-width: 1200px; max-width: 1200px;
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
text-align: center;
&:hover {
.main-cta {
@include box-shadow(0 1px 16px 0 rgba($blue, 0.35));
}
}
} }
h1 { .inner-wrapper {
color: rgb(255,255,255); background: rgba(255,255,255, 0.9);
border: 1px solid rgb(100,100,100);
@include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5));
@include inline-block;
padding: 30px 50px 30px;
position: relative;
text-align: center; text-align: center;
z-index: 1;
}
.title {
@include inline-block;
margin-right: 50px;
padding-right: 50px;
position: relative;
text-align: left;
vertical-align: middle;
&::after {
@extend .faded-vertical-divider;
content: "";
display: block;
height: 170px;
position: absolute;
right: 0px;
top: -20px;
}
h1 {
border-bottom: 1px solid rgb(200,200,200);
margin-bottom: 25px;
padding-bottom: 15px;
text-align: left;
text-shadow: 0 1px rgba(255,255,255, 0.6);
}
p {
color: $lighter-base-font-color;
display: none;
font-style: italic;
letter-spacing: 2px;
margin-bottom: 30px;
text-shadow: 0 1px rgba(255,255,255, 0.6);
text-transform: lowercase;
}
.main-cta {
@include clearfix;
float: left;
margin-right: flex-gutter();
@include transition(all, 0.15s, linear);
width: flex-grid(6);
> a.find-courses {
@include button(shiny, $blue);
@include box-sizing(border-box);
@include border-radius(3px);
display: block;
font: italic 1.4rem/1.6rem $serif;
letter-spacing: 1px;
padding: 12px 0px;
text-transform: uppercase;
text-align: center;
-webkit-font-smoothing: antialiased;
width: flex-grid(12);
&:hover {
color: rgb(255,255,255);
}
}
}
.social-sharing {
@include box-sizing(border-box);
float: left;
height: 44px;
position: relative;
text-align: center;
width: flex-grid(6);
&:hover {
.sharing-message {
opacity: 1;
top: 63px;
}
}
.sharing-message {
@include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.9) 0%,
rgba(0,0,0, 0.7) 100%));
border: 1px solid rgba(0,0,0, 0.5);
@include border-radius(4px);
@include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5));
@include box-sizing(border-box);
color: rgb(255,255,255);
float: right;
font: italic 1.2rem/1.6rem $serif;
left: 50%;
margin-left: -110px;
opacity: 0;
padding: 5px 10px;
position: absolute;
text-align: center;
@include transition(all, 0.15s, ease-out);
top: 73px;
width: 220px;
&::before {
background: transparent;
border: {
top: 6px solid rgba(0,0,0, 1);
right: 6px solid rgba(0,0,0, 1);
bottom: 6px solid transparent;
left: 6px solid transparent;
}
@include box-shadow(1px 0 0 0 rgb(0,0,0), 0 -1px 0 0 rgb(0,0,0));
content: "";
display: block;
height: 0px;
left: 50%;
margin-left: -7px;
position: absolute;
@include transform(rotate(-45deg));
top: -6px;
width: 0px;
}
}
.share {
height: 44px;
@include inline-block;
margin-right: 10px;
opacity: 0.5;
@include transition(all, 0.15s, linear);
width: 44px;
&:hover {
opacity: 1;
}
img {
width: 100%;
}
&:last-child {
margin-right: 0px;
}
}
}
} }
a { .media {
@include button(shiny, $blue); background: #fff;
border: 1px solid rgb(200,200,200);
@include box-sizing(border-box); @include box-sizing(border-box);
@include border-radius(3px); @include inline-block;
display: block; padding: 1px;
font: italic 1.4rem/1.6rem $serif; position: relative;
vertical-align: middle;
width: 210px;
z-index: 2;
.hero {
height: 125px;
overflow: hidden;
position: relative;
.play-intro {
@include background-image(linear-gradient(-90deg, rgba(255,255,255, 0.6), rgba(255,255,255, 0.4)));
@include border-radius(4px);
@include box-shadow(0 1px 10px 0 rgba(0,0,0, 0.2));
border: 1px solid rgba(0,0,0, 0.3);
height: 80px;
left: 50%;
margin-top: -40px;
margin-left: -40px;
position: absolute;
top: 50%;
width: 80px;
&::after {
color: $base-font-color;
content: "\25B6";
display: block;
font: normal 3.2rem/3.2rem $sans-serif;
left: 50%;
margin-left: -12px;
margin-top: -17px;
position: absolute;
text-shadow: 0 1px rgba(255,255,255, 0.8);
top: 50%;
}
}
img {
display: block;
width: 100%;
}
}
&:hover {
cursor: pointer;
.play-intro {
@include background-image(linear-gradient(-90deg, rgba(255,255,255, 0.7), rgba(255,255,255, 0.5)));
@include box-shadow(0 1px 10px 0 rgba(0,0,0, 0.2));
border: 1px solid rgba(0,0,0, 0.4);
&::after {
color: $pink;
}
}
}
}
}
.highlighted-courses {
border-bottom: 1px solid rgb(210,210,210);
@include box-sizing(border-box);
margin-bottom: 60px;
position: relative;
width: flex-grid(12);
z-index: 1;
> h2 {
@include background-image(linear-gradient(-90deg, rgb(250,250,250), rgb(230,230,230)));
border: 1px solid rgb(200,200,200);
@include border-radius(4px);
border-top-color: rgb(190,190,190);
@include box-shadow(inset 0 0 0 1px rgba(255,255,255, 0.4), 0 0px 12px 0 rgba(0,0,0, 0.2));
color: $lighter-base-font-color;
letter-spacing: 1px; letter-spacing: 1px;
margin: 0 auto; margin-bottom: 0px;
padding: 15px 0px; margin-top: -15px;
text-transform: uppercase; padding: 15px 10px;
text-align: center; text-align: center;
-webkit-font-smoothing: antialiased; text-transform: uppercase;
width: flex-grid(3); text-shadow: 0 1px rgba(255,255,255, 0.6);
&:hover { .lowercase {
color: rgb(255,255,255); color: $lighter-base-font-color;
text-transform: none;
} }
} }
} }
...@@ -176,34 +406,6 @@ ...@@ -176,34 +406,6 @@
} }
} }
.highlighted-courses {
border-bottom: 1px solid rgb(210,210,210);
@include box-sizing(border-box);
margin-bottom: 60px;
width: flex-grid(12);
> h2 {
@include background-image(linear-gradient(-90deg, rgb(250,250,250), rgb(230,230,230)));
border: 1px solid rgb(200,200,200);
@include border-radius(4px);
border-top-color: rgb(190,190,190);
@include box-shadow(inset 0 0 0 1px rgba(255,255,255, 0.4), 0 0px 12px 0 rgba(0,0,0, 0.2));
color: $lighter-base-font-color;
letter-spacing: 1px;
margin-bottom: 0px;
margin-top: -15px;
padding: 15px 10px;
text-align: center;
text-transform: uppercase;
text-shadow: 0 1px rgba(255,255,255, 0.6);
.lowercase {
color: $lighter-base-font-color;
text-transform: none;
}
}
}
.more-info { .more-info {
margin-bottom: 60px; margin-bottom: 60px;
width: flex-grid(12); width: flex-grid(12);
......
lms/static/sass/_shared_footer.scss
...@@ -3,7 +3,6 @@ footer { ...@@ -3,7 +3,6 @@ footer {
border-top: 1px solid rgb(200,200,200); border-top: 1px solid rgb(200,200,200);
@include box-shadow(inset 0 1px 3px 0 rgba(0,0,0, 0.1)); @include box-shadow(inset 0 1px 3px 0 rgba(0,0,0, 0.1));
margin: 0 auto; margin: 0 auto;
padding: 0 0 40px;
width: flex-grid(12); width: flex-grid(12);
&.fixed-bottom { &.fixed-bottom {
...@@ -14,12 +13,28 @@ footer { ...@@ -14,12 +13,28 @@ footer {
nav { nav {
@include box-sizing(border-box); @include box-sizing(border-box);
@include clearfix;
max-width: 1200px; max-width: 1200px;
margin: 0 auto; margin: 0 auto;
padding: 20px 10px 0; padding: 20px 10px 0;
width: flex-grid(12); width: flex-grid(12);
.primary-links {
@include clearfix;
margin-bottom: 30px;
}
.secondary-links {
padding-bottom: 10px;
text-align: left;
a {
color: $lighter-base-font-color;
font: 300 1.2rem/1.6rem $sans-serif;
letter-spacing: 1px;
margin-right: 20px;
}
}
.copyright { .copyright {
float: left; float: left;
padding-top: 2px; padding-top: 2px;
......
lms/templates/about.html
...@@ -27,9 +27,9 @@ ...@@ -27,9 +27,9 @@
<div class="photo"> <div class="photo">
<img src=""> <img src="">
</div> </div>
<h2>What it's like to work here</h2> <h2>Mission: Educate 1 billion people around the world</h2>
<p>“Harvard and MIT will use these new technologies and the research they will make possible to lead the direction of online learning in a way that benefits our students, our peers, and people across the nation and the globe,” Faust continued.</p> <p>“EdX represents a unique opportunity to improve education on our own campuses through online learning, while simultaneously creating a bold new educational path for millions of learners worldwide,” MIT President Susan Hockfield said.</p>
<p>[fast-moving not-for-profit startup][institutional backing, funding, benefits, and stability][industry salaries]</p> <p>Harvard President Drew Faust said, “edX gives Harvard and MIT an unprecedented opportunity to dramatically extend our collective reach by conducting groundbreaking research into effective education and by extending online access to quality higher education.”
<hr class="fade-left-hr-divider"> <hr class="fade-left-hr-divider">
</section> </section>
......
lms/templates/contact.html
...@@ -12,15 +12,22 @@ ...@@ -12,15 +12,22 @@
<section class="contact"> <section class="contact">
<div class="map"> <div class="map">
<img src="${static.url('images/edx-location.png')}">
</div> </div>
<div class="address"> <div class="contacts">
Suggest a Feature <h2>Email Contacts</h2>
Suggest a Topic <ul>
Report a Problem <li><p>System-related questions: <a href="mailto:technical@mitx.mit.edu">technical@mitx.mit.edu</a></p></li>
Ask the Community <li><p>Content-related questions: <a href="mailto:content@mitx.mit.edu">content@mitx.mit.edu</a></p></li>
Send Thanks <li><p>Bug reports: <a href="mailto:bugs@mitx.mit.edu">bugs@mitx.mit.edu</a></p></li>
Submit a Comment <li><p>Suggestions: <a href="mailto:suggestions@mitx.mit.edu">suggestions@mitx.mit.edu</a></p></li>
Mailing Address </ul>
<h2>Physical Address</h2>
<ul>
<li><p>11 Cambridge Center</p></li>
<li><p>Cambridge, MA 02142</p></li>
</ul>
</div> </div>
</section> </section>
</section> </section>
......
lms/templates/copyright.html
<%inherit file="marketing.html" /> <%! from django.core.urlresolvers import reverse %>
<%inherit file="main.html" />
<section class="copyright"> <%namespace name='static' file='static_content.html'/>
<div> <section class="static-container copyright">
<h1> Licensing Information </h1> <h1> Licensing Information </h1>
<hr class="horizontal-divider">
<ul> <div class="inner-wrapper">
<li> <h2>Videos and Exercises</h2>
<h2>Videos and Exercises</h2> <p> Copyright &copy; 2012 MIT. All rights reserved. In order to further MIT's goal of making education accessible and affordable to the world, MIT is planning to make <i>MITx</i> course content available under open source licenses.</p>
<p> Copyright &copy; 2012 MIT. All rights reserved. In order to
further MIT's goal of making education accessible and affordable
to the world, MIT is planning to make <i>MITx</i> course content
available under open source licenses.
</p>
</li>
<li> <h2>Textbook</h2>
<h2>Textbook</h2> <p> Copyright &copy; 2005 Elsevier Inc. All Rights Reserved. Used with permission. While our goal is to build courses with as much free and open content as possible, we apologize that we do not have the ability to do so entirely. </p>
<p> Copyright &copy; 2005 Elsevier Inc. All Rights
Reserved. Used with permission. While our goal is to build
courses with as much free and open content as possible, we
apologize that we do not have the ability to do so
entirely. </p>
</li>
<li> <h2>Student-generated content</h2>
<h2>Student-generated content</h2> <p>Copyright &copy; 2012. All Rights Reserved. Due to privacy concerns, we do not know what portion of these will be released under open licenses.</p>
<td>Copyright &copy; 2012. All Rights Reserved. Due to privacy
concerns, we do not know what portion of these will be released
under open licenses. </td></li>
</ul>
<p>MIT and <i>MITx</i> are trademarks of the Massachusetts Institute <p>MIT and <i>MITx</i> are trademarks of the Massachusetts Institute of Technology, and may not be used without permission.</p>
of Technology, and may not be used without permission.</p>
</div> </div>
</section> </section>
lms/templates/dashboard.html
...@@ -31,79 +31,41 @@ ...@@ -31,79 +31,41 @@
% if len(courses) > 0: % if len(courses) > 0:
% for course in courses: % for course in courses:
<article class="my-course"> <article class="my-course">
<a href="${reverse('info', args=[course.id])}"> <a href="${reverse('info', args=[course.id])}" class="cover" style="background-image: url('static/images/courses/python.png')">
<div class="cover"> <div class="shade"></div>
<div class="shade"></div> <div class="arrow"></div>
<div class="arrow"></div> </a>
<img src="${static.url('images/circuits.jpeg')}" /> <section class="info">
</div> <hgroup>
<section class="info"> <h3><a href="#">${course.get_about_section('university')}</a></h3>
<hgroup> <h2><a href="${reverse('info', args=[course.id])}">${course.get_about_section("title")}</a></h2>
% for instructor in course.instructors: </hgroup>
<h3>${course.get_about_section('university')}</h3> <section class="course-status">
% endfor <p>Class starts - <span>9/2/2012</span></div>
<h2>${course.get_about_section("title")}</h2> </section>
</hgroup> <section class="meta">
<section class="meta"> <div src="" class="course-work-icon"></div>
<div class="complete"> <div class="progress">
<p>60% complete</p> <div class="meter">
</div> <div class="meter-fill"></div>
<div class="progress">
<div class="meter">
<div class="meter-fill"></div>
</div>
</div>
<div class="end-date">
<p>End date: <time>6/10/12</time></p>
</div> </div>
</section> </div>
<div class="complete">
<p><span class="completeness">60%</span> compleat</p>
</div>
</section> </section>
</a> </section>
</article> </article>
% endfor % endfor
% else: % else:
<section class="empty-dashboard-message"> <section class="empty-dashboard-message">
<p>Looks like you aren't registered for any courses. You should take a minute and <a href="${reverse('courses')}" class="find-courses">Find some courses!</a></p> <p>Looks like you haven't registered for any courses yet.</p>
<a href="${reverse('courses')}">Find courses now!</a>
</section> </section>
% endif % endif
<article class="my-course">
<a href="/info" class="cover" style="background-image: url('static/images/courses/python.png')">
<div class="shade"></div>
<div class="arrow"></div>
</a>
<section class="info">
<hgroup>
<h3><a href="">HarvardX</a></h3>
<h2><a href="/info">CS 102 Python</a></h2>
</hgroup>
</section>
</article>
<article class="my-course">
<a href="/info" class="cover" style="background-image: url('static/images/courses/python.png')">
<div class="shade"></div>
<div class="arrow"></div>
</a>
<section class="info">
<hgroup>
<h3><a href="">HarvardX</a></h3>
<h2><a href="/info">CS 102 Python</a></h2>
</hgroup>
<section class="meta">
<div src="" class="course-work-icon"></div>
<div class="progress">
<div class="meter">
<div class="meter-fill"></div>
</div>
</div>
<div class="complete">
<p><span class="completeness">60%</span> compleat</p>
</div>
</section>
</section>
</article>
</section> </section>
</section> </section>
lms/templates/footer.html
...@@ -3,28 +3,36 @@ ...@@ -3,28 +3,36 @@
<footer> <footer>
<nav> <nav>
<section class="copyright"> <section class="primary-links">
<a href="${reverse('root')}" class="logo"></a> <section class="copyright">
<p>&copy; 2012 edX, <a href="#">some rights reserved.</a></p> <a href="${reverse('root')}" class="logo"></a>
<p>&copy; 2012 edX, <a href="/t/copyright.html">some rights reserved.</a></p>
</section>
<ol>
<li>
<a href="${reverse('courses')}">Find Courses</a>
</li>
<li>
<a href="/t/about.html">About</a>
</li>
<li>
<a href="#">Blog</a>
</li>
<li>
<a href="/t/jobs.html">Jobs</a>
</li>
<li class="social">
<a href="#"><img src="${static.url('images/linkedin.png')}" /></a>
<a href="#"><img src="${static.url('images/facebook.png')}" /></a>
<a href="#"><img src="${static.url('images/twitter.png')}" /></a>
</li>
</ol>
</section>
<section class="secondary-links">
<a href="/t/tos.html">Terms of Service</a>
<a href="/t/privacy.html">Privacy Policy</a>
<a href="/t/honor.html">Honor Code</a>
<a href="/t/help.html">Help</a>
</section> </section>
<ol>
<li>
<a href="${reverse('courses')}">Find Courses</a>
</li>
<li>
<a href="${reverse('about_edx')}">About</a>
</li>
<li>
<a href="#">Blog</a>
</li>
<li>
<a href="${reverse('jobs')}">Jobs</a>
</li>
<li class="social">
<a href="#"><img src="${static.url('images/linkedin.png')}" /></a>
<a href="#"><img src="${static.url('images/facebook.png')}" /></a>
<a href="#"><img src="${static.url('images/twitter.png')}" /></a>
</li>
</ol>
</nav> </nav>
</footer> </footer>
lms/templates/help.html
<%! from django.core.urlresolvers import reverse %>
<%inherit file="main.html" /> <%inherit file="main.html" />
<%namespace name='static' file='static_content.html'/>
<%block name="title"><title>Help - MITx 6.002x</title></%block> <%block name="title"><title>Help - MITx 6.002x</title></%block>
<section class="help main-content"> <section class="static-container help">
<h1>Help</h1> <h1>Help</h1>
<hr class="horizontal-divider">
<section class="self-help"> <div class="inner-wrapper">
<h2>Self-help</h2> <h2>Self-help</h2>
<ul> <ul>
<li>Read <li><p>Read the <a href="/t/faq.html">FAQ</a> carefully</p></li>
the <a href="http://mitx.mit.edu/6002x-faq.html">FAQ</a> <li><p>Check the <a href="/info">course updates</a> -- we will announce major errors and issues there </p></li>
carefully</li> <li><p>Check whether the issues has been asked on the <a href="/discussion">discussion forums</a>, and if not, ask</p></li>
<li>Check the <a href="/info">course updates</a> -- we will <li><p>Ask in the IRC channel (irc.mitx.mit.edu, channel #6002)]</p></li>
announce major errors and issues there </li> <li><p>Check the <a href="/info">course handouts.</a></p></li>
<li>Check whether the issues has been asked on
the <a href="/discussion">discussion forums</a>, and if not,
ask</li>
<li>Ask in the IRC channel (irc.mitx.mit.edu, channel #6002)]</li>
<li>Check the <a href="/info">course handouts.</a></li>
</ul> </ul>
</section>
<h2>Help email</h2>
<section class="help-email"> <p> If you can't solve your problems with self-help, we have several e-mail addresses set up:</p>
<h2>Help email</h2>
<p> If you can't solve your problems with self-help, we have several <ul>
e-mail addresses set up:</p> <li><p>System-related questions: <a href="mailto:technical@mitx.mit.edu">technical@mitx.mit.edu</a></p></li>
<li><p>Content-related questions: <a href="mailto:content@mitx.mit.edu">content@mitx.mit.edu</a></p></li>
<dl> <li><p>Bug reports: <a href="mailto:bugs@mitx.mit.edu">bugs@mitx.mit.edu</a></p></li>
<dt>System-related questions</dt> <li><p>Suggestions: <a href="mailto:suggestions@mitx.mit.edu">suggestions@mitx.mit.edu</a></p></li>
<dd><a href="mailto:technical@mitx.mit.edu">technical@mitx.mit.edu</a></dd> </ul>
<dt>Content-related questions</dt>
<dd><a href="mailto:content@mitx.mit.edu">content@mitx.mit.edu</a></dd> <p>Please bear in mind that while we read them, we do not expect to have time to respond to all e-mails. For technical questions, please make sure you are using the latest version of <a href="http://www.mozilla.org/en-US/firefox/new/">Firefox</a> or <a href="https://www.google.com/chrome/">Chrome</a>, and include browser and version in your e-mail, as well as screenshots or other pertinent details.</p>
<dt>Bug reports</dt> </div>
<dd><a href="mailto:bugs@mitx.mit.edu">bugs@mitx.mit.edu</a></dd>
<dt>Suggestions</dt>
<dd><a href="mailto:suggestions@mitx.mit.edu">suggestions@mitx.mit.edu</a></dd>
</dl>
<p> Please bear in mind that while we read them, we do not
expect to have time to respond to all e-mails. For technical
questions, please make sure you are using the latest version
of <a href="http://www.mozilla.org/en-US/firefox/new/">Firefox</a>
or <a href="https://www.google.com/chrome/">Chrome</a>, and
include browser and version in your e-mail, as well as
screenshots or other pertinent details. </p>
</section>
</section> </section>
lms/templates/honor.html
<%inherit file="marketing.html" /> <%! from django.core.urlresolvers import reverse %>
<%inherit file="main.html" />
<section class="honor-code"> <%namespace name='static' file='static_content.html'/>
<div>
<h1> Collaboration Policy </h1>
<section class="static-container honor-code">
<h1> Collaboration Policy </h1>
<hr class="horizontal-divider">
<div class="inner-wrapper">
<p> By enrolling in a course on <i>edX</i>, you are joining a <p> By enrolling in a course on <i>edX</i>, you are joining a
special worldwide community of learners. The aspiration special worldwide community of learners. The aspiration
of <i>edX</i> is to provide anyone in the world who has the of <i>edX</i> is to provide anyone in the world who has the
motivation and ability to engage edX coursework the opportunity motivation and ability to engage edX coursework the opportunity
to attain the best edX-based educational experience that to attain the best edX-based educational experience that
Internet technology enables. You are part of the community who Internet technology enables. You are part of the community who
will help <i>edX</i> achieve this goal. will help <i>edX</i> achieve this goal.</p>
<p> <i>edX</i> depends upon your motivation to learn the material <p> <i>edX</i> depends upon your motivation to learn the material
and to do so with honesty. In order to participate and to do so with honesty. In order to participate
in <i>edX</i>, you must agree to the Honor Code below and any in <i>edX</i>, you must agree to the Honor Code below and any
additional terms specific to a class. This Honor Code, and any additional terms specific to a class. This Honor Code, and any
additional terms, will be posted on each class website. additional terms, will be posted on each class website.</p>
<div style="color:darkred;"> <h2><i>edX</i> Honor Code Pledge</h2>
<h2> <i>edX</i> Honor Code Pledge</h2>
<p> By enrolling in an <i>edX</i> course, I agree that I will:</p>
<p> By enrolling in an <i>edX</i> course, I agree that I will:
<ul>
<ul> <li>
<li> Complete all mid-terms and final exams with my own work <p>Complete all mid-terms and final exams with my own work and only my own work. I will not submit the work of any other person.</p>
and only my own work. I will not submit the work of any </li>
other person. <li>
<li> Maintain only one user account and not let anyone else <p>Maintain only one user account and not let anyone else use my username and/or password.</p>
use my username and/or password. </li>
<li> Not engage in any activity that would dishonestly improve <li>
my results, or improve or hurt the results of others. <p>Not engage in any activity that would dishonestly improve my results, or improve or hurt the results of others.</p>
<li> Not post answers to problems that are being used to </li>
assess student performance. <li>
</ul> <p>Not post answers to problems that are being used to assess student performance.</p>
</div> </li>
<p> Unless otherwise indicated by the instructor of an <i>edX</i> </ul>
course, learners on <i>edX</i> are encouraged to:
<ul> <p> Unless otherwise indicated by the instructor of an <i>edX</i> course, learners on <i>edX</i> are encouraged to:</p>
<li> Collaborate with others on the lecture videos, exercises,
homework and labs. <ul>
<li> Discuss with others general concepts and materials in <li>
each course. <p>Collaborate with others on the lecture videos, exercises, homework and labs.</p>
<li> Present ideas and written work to fellow <i>edX</i> </li>
learners or others for comment or criticism. <li>
</ul> <p>Discuss with others general concepts and materials in each course.</p>
</li>
<li>
<p>Present ideas and written work to fellow <i>edX</i> learners or others for comment or criticism.</p>
</li>
</ul>
</div> </div>
</section> </section>
lms/templates/index.html
...@@ -4,9 +4,36 @@ ...@@ -4,9 +4,36 @@
<section class="home"> <section class="home">
<header> <header>
<div class="inner-wrapper"> <div class="outer-wrapper">
<h1>The Future of Online Education</h1> <div class="inner-wrapper">
<a href="${reverse('courses')}" class="find-courses">Find Courses</a> <div class="title">
<h1>The Future of Online Education</h1>
<p>Free. Online. World Class.</p>
<div class="main-cta">
<a href="${reverse('courses')}" class="find-courses">Find Courses</a>
</div>
<div class="social-sharing">
<div class="sharing-message">Share with friends and family!</div>
<a href="#" class="share">
<img src="${static.url('images/twitter-sharing.png')}">
</a>
<a href="#" class="share">
<img src="${static.url('images/facebook-sharing.png')}">
</a>
<a href="#" class="share">
<img src="${static.url('images/email-sharing.png')}">
</a>
</div>
</div>
<div class="media">
<div class="hero">
<img src="${static.url('images/courses/space1.jpg')}" />
<div class="play-intro"></div>
</div>
</div>
</div>
</div> </div>
</header> </header>
......
lms/templates/terms_and_conditions.html deleted 100644 → 0
<%! from django.core.urlresolvers import reverse %>
<%inherit file="main.html" />
<%namespace name='static' file='static_content.html'/>
<section class="container">
</section>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment