diff --git a/lms/static/images/berkeley-cover.jpeg b/lms/static/images/berkeley-cover.jpeg new file mode 100644 index 0000000000..c228d30965 Binary files /dev/null and b/lms/static/images/berkeley-cover.jpeg differ diff --git a/lms/static/images/harvard-cover.jpeg b/lms/static/images/harvard-cover.jpeg new file mode 100644 index 0000000000..943fa9ade5 Binary files /dev/null and b/lms/static/images/harvard-cover.jpeg differ diff --git a/lms/static/images/intro-video.jpg b/lms/static/images/intro-video.jpg new file mode 100644 index 0000000000..84933d7fe4 Binary files /dev/null and b/lms/static/images/intro-video.jpg differ diff --git a/lms/static/images/portal-icons/prerec-icon.png b/lms/static/images/portal-icons/prerec-icon.png new file mode 100644 index 0000000000..70f11c2e0b Binary files /dev/null and b/lms/static/images/portal-icons/prerec-icon.png differ diff --git a/lms/static/sass/_course_about.scss b/lms/static/sass/_course_about.scss index 9899052fba..a0c4d42f91 100644 --- a/lms/static/sass/_course_about.scss +++ b/lms/static/sass/_course_about.scss @@ -34,7 +34,6 @@ @include box-sizing(border-box); @include clearfix; float: left; - height: 180px; padding: 20px 20px; position: relative; width: flex-grid(8) + flex-gutter(); @@ -43,17 +42,31 @@ > hgroup { border-bottom: 1px solid rgb(210,210,210); @include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6)); - margin-bottom: 27px; + margin-bottom: 20px; padding-bottom: 20px; width: 100%; h1 { color: $base-font-color; - font-weight: 700; + font-weight: normal; @include inline-block; - margin: 0 10px 0 0; + margin: 0; letter-spacing: 0px; + text-align: left; text-shadow: 0 1px rgba(255,255,255, 0.6); + + a { + color: $lighter-base-font-color; + font: italic 800 0.6em/1em $sans-serif; + letter-spacing: 0px; + margin-left: 15px; + text-shadow: 0 1px rgba(255,255,255, 0.6); + text-transform: none; + + &:hover { + color: $blue; + } + } } h2 { @@ -116,7 +129,6 @@ .media { background: transparent; - border-left: 1px solid rgb(100,100,100); @include box-sizing(border-box); display: block; float: right; @@ -167,6 +179,7 @@ &:hover { cursor: pointer; + text-decoration: none; .play-intro { @include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.75), rgba(0,0,0, 0.8))); @@ -246,9 +259,18 @@ .teacher-image { background: rgb(255,255,255); border: 1px solid rgb(200,200,200); + height: 115px; float: left; - margin: 0 15px 15px 0; + margin: 0 15px 0px 0; + overflow: hidden; padding: 1px; + width: 115px; + + img { + display: block; + min-height: 100%; + max-width: 100%; + } } } } @@ -397,21 +419,29 @@ @include transition(all, 0.15s, linear); width: 19px; - &.start-icon { + &.start { @include background-image(url('../images/portal-icons/calendar-icon.png')); } - &.final-icon { - @include background-image(url('../images/portal-icons/pencil-icon.png')); + &.end { + @include background-image(url('../images/portal-icons/calendar-icon.png')); } - &.length-icon { + &.length { @include background-image(url('../images/portal-icons/chart-icon.png')); } - &.number-icon { + &.course-number { @include background-image(url('../images/portal-icons/course-info-icon.png')); } + + &.effort { + @include background-image(url('../images/portal-icons/pencil-icon.png')); + } + + &.prerequisites { + @include background-image(url('../images/portal-icons/prerec-icon.png')); + } } span { diff --git a/lms/static/sass/shared/_course_object.scss b/lms/static/sass/shared/_course_object.scss index 445fed64e7..b92973a79d 100644 --- a/lms/static/sass/shared/_course_object.scss +++ b/lms/static/sass/shared/_course_object.scss @@ -106,6 +106,7 @@ &:hover { @include background-image(linear-gradient(-90deg, rgba(255,255,255, 1), rgba(255,255,255, 0.8))); + text-decoration: none; h2, .info-link { color: $blue; diff --git a/lms/templates/portal/course_about.html b/lms/templates/portal/course_about.html index 48c072036a..f898f2b8f1 100644 --- a/lms/templates/portal/course_about.html +++ b/lms/templates/portal/course_about.html @@ -14,7 +14,7 @@
Course Number
${course.number}Classes Start
${course.start_date_text}Course Number
${course.number}Classes Start
${course.start_date_text}Classes End
${get_course_about_section(course, "end_date")}Classes End
${get_course_about_section(course, "end_date")}Estimated Effort
${get_course_about_section(course, "effort")}Estimated Effort
${get_course_about_section(course, "effort")}Course Length
15 weeksPrerequisites
${get_course_about_section(course, "prerequisites")}Prerequisites
${get_course_about_section(course, "prerequisites")}Course Length
15 weeks