style: banner

school/lms/md.py

@@ -105,7 +105,7 @@ def sanitize_html(html, macro):
     any broken tags. This makes sures that all those things are fixed
     before passing to the etree parser.
     """
-    soup = BeautifulSoup(html, features="html5lib")
+    soup = BeautifulSoup(html, features="lxml")
     nodes = soup.body.children
     classname = ""
     if macro == "YouTubeVideo":

school/public/css/style.css

@@ -1136,6 +1136,9 @@ input[type=checkbox] {
 .progress {
   width: 100%;
   height: 4px;
+}
+
+.course-card-wide .progress {
   background-color: var(--gray-500);
 }
 
@@ -1348,6 +1351,11 @@ pre {
   top: 40%;
 }
 
+.related-courses {
+  background: var(--gray-50);
+  padding: 5rem 0;
+}
+
 .carousel-indicators {
   position: inherit;
   margin: 0;
@@ -1559,7 +1567,7 @@ pre {
 }
 
 .video-in-overlay {
-  top: 20%;
+  top: 30%;
 }
 
 .course-overlay-content {

school/www/courses/course.html

@@ -14,8 +14,8 @@
       {{ CourseCreator(course) }}
       {{ widgets.Reviews(course=course, membership=membership) }}
     </div>
-    {{ RelatedCourses(course) }}
   </div>
+  {{ RelatedCourses(course) }}
 </div>
 {% endblock %}
 
@@ -214,6 +214,7 @@
 {% macro RelatedCourses(course) %}
 {% if course.related_courses | length %}
 <div class="related-courses">
+  <div class="container">
     <div class="course-home-headings"> {{ _("Other Courses") }} </div>
     <div class="carousel slide" id="carouselExampleControls" data-ride="carousel" data-interval="false">
       <div class="carousel-inner">
@@ -242,5 +243,7 @@
 
     </div>
   </div>
+
+</div>
 {% endif%}
 {% endmacro %}