fix categories in courses, small style fixes, landing page module adjustments

assets/stylesheets/course.css

@@ -15,6 +15,11 @@
 .course-card__categories {
   flex: 0 0 var(--line-height);
   color: var(--color-text-grey);
+
+  & a {
+    display: inline-block;
+    margin-right: var(--grid-gutter);
+  }
 }
 
 .course-card__title {

public/stylesheets/style.css

@@ -1346,7 +1346,13 @@ body {
   -webkit-box-flex: 0;
       -ms-flex: 0 0 1.5em;
           flex: 0 0 1.5em;
-  color: #8091a5;
+  color: #8091a5
+}
+
+.course-card__categories a {
+  display: inline-block;
+  margin-right: 16px;
+  margin-right: 1rem;
 }
 
 .course-card__title {

services/contentful.js

@@ -11,7 +11,7 @@ exports.initClient = (config = {space: process.env.CF_SPACE, accessToken: proces
 exports.getCourses = () => {
   // to get all the courses we simply request from Contentful all the entries
   // with the content_type `course`
-  return client.getEntries({content_type: 'course'})
+  return client.getEntries({content_type: 'course', include: 10})
     .then((response) => response.items)
 }
 

views/mixins/_courseCard.pug

@@ -3,7 +3,7 @@ mixin courseCard(course = {fields: {title: '', description: '', categories: [],
     .course-card__categories
       if(course.fields.categories)
         each category in course.fields.categories
-          a(href=`categories/${category.fields.slug}`) #{category.title}
+          a(href=`/courses/categories/${category.sys.id}`) #{category.fields.title}
     .course-card__title
       h2= course.fields.title
     .course-card__description

views/mixins/_heroImageModule.pug

@@ -1,6 +1,6 @@
 mixin heroImageModule(module)
   .module
     .module__heroImage
-      h1.module__heroImage__title #{module.fields.title}
+      h2.module__heroImage__title #{module.fields.title}
-      h2.module__heroImage__headline #{module.fields.headline}
+      h3.module__heroImage__headline #{module.fields.headline}
       img.module__heroImage__image(src=`${module.fields.backgroundImage.fields.file.url}` alt=`${module.fields.backgroundImage.fields.title}`)

views/mixins/_highlightedCourse.pug

@@ -3,5 +3,5 @@ include ./_courseCard
 mixin highlightedCourseModule(module)
   .module
     .module__higlightedCourse
-      h1.module__higlightedCourse__title #{module.fields.title}
+      h2.module__higlightedCourse__title #{module.fields.title}
       +courseCard(module.fields.course)

views/mixins/_highlightedLessonsModule.pug

@@ -3,7 +3,7 @@ include _lesson
 mixin _highlightLessonsModule(module)
   .module
     .module__higlightedLessons
-      h1.module__higlightedLessons__title #{module.fields.title}
+      h2.module__higlightedLessons__title #{module.fields.title}
       each lesson in module.fields.lessons
         +lesson(lesson)
 

views/mixins/_lesson.pug

@@ -6,7 +6,8 @@ mixin lesson(lesson)
   .lesson
     h2.lesson__tilte #{lesson.fields.title}
     div.lesson__shortDescription !{helpers.markdown(lesson.fields.description)}
-    img.lesson__image(src=`${lesson.fields.image.fields.file.url}` alt=`${lesson.fields.image.fields.title}`)
+    if lesson.fields.image
+      img.lesson__image(src=`${lesson.fields.image.fields.file.url}` alt=`${lesson.fields.image.fields.title}`)
     each module in lesson.fields.modules
      case module.sys.contentType.sys.id
       when 'lessonModuleCodeSnippets'