Commit 0ff70472 by Kyle Fiedler

Added styles for dashboard to have link around whole class

parent 05da125a
...@@ -261,7 +261,7 @@ ...@@ -261,7 +261,7 @@
padding: 12px 0px; padding: 12px 0px;
width: 100%; width: 100%;
a.university { .university {
background: rgba(255,255,255, 1); background: rgba(255,255,255, 1);
border: 1px solid rgb(180,180,180); border: 1px solid rgb(180,180,180);
@include border-radius(3px); @include border-radius(3px);
...@@ -269,17 +269,14 @@ ...@@ -269,17 +269,14 @@
color: $lighter-base-font-color; color: $lighter-base-font-color;
display: block; display: block;
font-style: italic; font-style: italic;
font-family: $sans-serif;
font-size: 16px;
font-weight: 800; font-weight: 800;
@include inline-block; @include inline-block;
margin-right: 10px; margin-right: 10px;
margin-bottom: 0;
padding: 5px 10px; padding: 5px 10px;
float: left; float: left;
&:hover {
color: $blue;
text-decoration: none;
}
} }
h3 { h3 {
...@@ -392,18 +389,30 @@ ...@@ -392,18 +389,30 @@
} }
} }
&:hover { > a:hover {
.cover { .cover {
.shade { .shade {
background: rgba(255,255,255, 0.1); background: rgba(255,255,255, 0.1);
@include background-image(linear-gradient(-90deg, rgba(255,255,255, 0.3) 0%, @include background-image(linear-gradient(-90deg, rgba(255,255,255, 0.3) 0%,
rgba(0,0,0, 0.3) 100%)); rgba(0,0,0, 0.3) 100%));
} }
.arrow { .arrow {
opacity: 1; opacity: 1;
} }
} }
.info {
background: darken(rgb(250,250,250), 5%);
@include background-image(linear-gradient(-90deg, darken(rgb(253,253,253), 3%), darken(rgb(240,240,240), 5%)));
border-color: darken(rgb(190,190,190), 10%);
.course-status {
background: darken($yellow, 3%);
border-color: darken(rgb(200,200,200), 3%);
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6));
}
}
} }
} }
...@@ -420,5 +429,6 @@ ...@@ -420,5 +429,6 @@
color: #333; color: #333;
} }
} }
} }
} }
...@@ -72,30 +72,34 @@ ...@@ -72,30 +72,34 @@
else: else:
course_target = reverse('about_course', args=[course.id]) course_target = reverse('about_course', args=[course.id])
%> %>
<a href="${course_target}" class="cover" style="background-image: url('${course_image_url(course)}')">
<div class="shade"></div> <a href="${course_target}">
<div class="arrow">&#10095;</div> <section class="cover" style="background-image: url('${course_image_url(course)}')">
</a> <div class="shade"></div>
<section class="info"> <div class="arrow">&#10095;</div>
<hgroup>
<a href="${reverse('university_profile', args=[course.org])}" class="university">${get_course_about_section(course, 'university')}</a>
<h3><a href="${course_target}">${course.number} ${course.title}</a></h3>
</hgroup>
<section class="course-status">
<p>Class Starts - <span>${course.start_date_text}</span></div>
</section> </section>
<section class="meta">
<div class="course-work-icon"></div> <section class="info">
<div class="progress"> <hgroup>
<div class="meter"> <h2 class="university">${get_course_about_section(course, 'university')}</h2>
<div class="meter-fill"></div> <h3>${course.number} ${course.title}</h3>
</hgroup>
<section class="course-status">
<p>Class Starts - <span>${course.start_date_text}</span></div>
</section>
<section class="meta">
<div class="course-work-icon"></div>
<div class="progress">
<div class="meter">
<div class="meter-fill"></div>
</div>
</div> </div>
</div> <div class="complete">
<div class="complete"> ##<p><span class="completeness">60%</span> complete</p>
##<p><span class="completeness">60%</span> complete</p> </div>
</div> </section>
</section> </section>
</section> </a>
</article> </article>
<a href="#unenroll-modal" class="unenroll" rel="leanModal" data-course-id="${course.id}" data-course-number="${course.number}">Unregister</a> <a href="#unenroll-modal" class="unenroll" rel="leanModal" data-course-id="${course.id}" data-course-number="${course.number}">Unregister</a>
......
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