diff --git a/lms/static/sass/shared/_course_object.scss b/lms/static/sass/shared/_course_object.scss index 374caf48982d4f33e1fa71905f9e0c27c14d227d..2f6ca88a63c196bff2854e625b9a5825d5f843b2 100644 --- a/lms/static/sass/shared/_course_object.scss +++ b/lms/static/sass/shared/_course_object.scss @@ -24,6 +24,31 @@ width: 100%; @include transition(all, 0.15s, linear); + .status { + background: $blue; + color: white; + font-size: 10px; + left: 10px; + padding: 2px 10px; + @include border-radius(2px); + position: absolute; + text-transform: uppercase; + top: -6px; + z-index: 100; + } + + .status:after { + border-bottom: 6px solid shade($blue, 50%); + border-right: 6px solid transparent; + content: ""; + display: block; + height: 0; + position: absolute; + right: -6px; + top: 0; + width: 0; + } + a:hover { text-decoration: none; } diff --git a/lms/templates/course.html b/lms/templates/course.html index 50a00f9d3160f2d53a1f1fc13ae99d626329824c..7392dfcefa8f1fb443af1848dcfe053700065ae8 100644 --- a/lms/templates/course.html +++ b/lms/templates/course.html @@ -5,6 +5,7 @@ %> <%page args="course" /> <article id="${course.id}" class="course"> + <span class="status">New</span> <a href="${reverse('about_course', args=[course.id])}"> <div class="inner-wrapper"> <header class="course-preview">