Skip to content

E
edx-platform
Commit 48d39ee7 by Galen Frechette
Options

fixes coursse about header to accept very long course names, fixes icons on course about sidebar

parent 7a332d7b
Showing with 51 additions and 20 deletions
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 {
......
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;
......
lms/templates/portal/course_about.html
......@@ -14,7 +14,7 @@
<div class="intro-inner-wrapper">
<section class="intro">
<hgroup>
<h1>${course.number}: ${get_course_about_section(course, "title")}</h1><h2><a href="${reverse('university_profile', args=[course.org])}">${get_course_about_section(course, "university")}</a></h2>
<h1>${course.number}: ${get_course_about_section(course, "title")}<a href="${reverse('university_profile', args=[course.org])}">${get_course_about_section(course, "university")}</a></h1>
</hgroup>
<div class="main-cta">
......@@ -42,7 +42,7 @@
<div class="hero">
<img src="${course_image_url(course)}" />
</div>
</a>
</div>
% endif
</div>
</header>
......@@ -81,23 +81,23 @@
</header>
<ol class="important-dates">
<li><div class="icon number-icon"></div><p>Course Number</p><span class="course-number">${course.number}</span></li>
<li><div class="icon start-icon"></div><p>Classes Start</p><span class="start-date">${course.start_date_text}</span></li>
<li><div class="icon course-number"></div><p>Course Number</p><span class="course-number">${course.number}</span></li>
<li><div class="icon start"></div><p>Classes Start</p><span class="start-date">${course.start_date_text}</span></li>
## End date should come from course.xml, but this is a quick hack
% if get_course_about_section(course, "end_date"):
<li><div class="icon final-icon"></div><p>Classes End</p><span class="final-date">${get_course_about_section(course, "end_date")}</span></li>
<li><div class="icon end"></div><p>Classes End</p><span class="final-date">${get_course_about_section(course, "end_date")}</span></li>
% endif
% if get_course_about_section(course, "effort"):
<li><div class="icon"></div><p>Estimated Effort</p><span class="start-date">${get_course_about_section(course, "effort")}</span></li>
<li><div class="icon effort"></div><p>Estimated Effort</p><span class="start-date">${get_course_about_section(course, "effort")}</span></li>
% endif
##<li><div class="icon length"></div><p>Course Length</p><span class="course-length">15 weeks</span></li>
% if get_course_about_section(course, "prerequisites"):
<li><div class="icon"></div><p>Prerequisites</p><span class="start-date">${get_course_about_section(course, "prerequisites")}</span></li>
<li><div class="icon prerequisites"></div><p>Prerequisites</p><span class="start-date">${get_course_about_section(course, "prerequisites")}</span></li>
% endif
##<li><div class="icon length-icon"></div><p>Course Length</p><span class="course-length">15 weeks</span></li>
</ol>
</section>
</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