From 053e4894866f0c9c37a51f065c323a418a451bb1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benedikt=20R=C3=B6tsch?= <benedikt@contentful.com>
Date: Fri, 6 Oct 2017 13:16:19 +0200
Subject: [PATCH] fix(modules): highlighted course bg image

---
 .../landing-page/modules/highlighted-course.css          | 9 +++------
 public/stylesheets/style.css                             | 9 +++------
 views/mixins/_moduleHighlightedCourse.pug                | 5 +----
 3 files changed, 7 insertions(+), 16 deletions(-)

diff --git a/assets/stylesheets/landing-page/modules/highlighted-course.css b/assets/stylesheets/landing-page/modules/highlighted-course.css
index 861c9ff..781b497 100644
--- a/assets/stylesheets/landing-page/modules/highlighted-course.css
+++ b/assets/stylesheets/landing-page/modules/highlighted-course.css
@@ -5,12 +5,9 @@
     height: 50vh;
     max-height: 500px;
     border-radius: var(--border-radius);
-  }
-
-  @element image {
-    display: block;
-    width: 100%;
-    height: auto;
+    background-size: cover;
+    background-repeat: no-repeat;
+    background-position: center center;
   }
 
   @element overlay {
diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css
index 848a80b..b9d907a 100644
--- a/public/stylesheets/style.css
+++ b/public/stylesheets/style.css
@@ -1874,12 +1874,9 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
     height: 50vh;
     max-height: 500px;
     border-radius: 4px;
-}
-
-.module-higlighted-course__image {
-    display: block;
-    width: 100%;
-    height: auto;
+    background-size: cover;
+    background-repeat: no-repeat;
+    background-position: center center;
 }
 
 .module-higlighted-course__overlay {
diff --git a/views/mixins/_moduleHighlightedCourse.pug b/views/mixins/_moduleHighlightedCourse.pug
index 0a6acf1..70cec60 100644
--- a/views/mixins/_moduleHighlightedCourse.pug
+++ b/views/mixins/_moduleHighlightedCourse.pug
@@ -2,10 +2,7 @@ include ./_courseCard
 
 mixin moduleHighlightedCourse(module, course)
   .module.module-higlighted-course
-    .module-higlighted-course__wrapper
-      .module-higlighted-course__image-wrapper
-        if course.fields.image
-          img.module-hero-image__image(src=`${course.fields.image.fields.file.url}` alt=`${course.fields.image.fields.title}`)
+    .module-higlighted-course__wrapper(style=`background-image: url(${course.fields.image.fields.file.url});`)
       .module-higlighted-course__overlay
       .module-higlighted-course__content
         if(course.fields.categories)