From 6cc16430e332bd4a082876c329f55355cea9bc7d Mon Sep 17 00:00:00 2001
From: Vesa Luusua <vesa.luusua@gmail.com>
Date: Thu, 25 Oct 2018 13:16:31 +0300
Subject: [PATCH] Styleguide cleaning: ImageCarousel was using vw units (temp
 fix for styleguide)

---
 .../ImageCarousel/ImageCarousel.example.css          | 12 ++++++++++++
 .../ImageCarousel/ImageCarousel.example.js           |  7 ++++---
 2 files changed, 16 insertions(+), 3 deletions(-)
 create mode 100644 src/components/ImageCarousel/ImageCarousel.example.css

diff --git a/src/components/ImageCarousel/ImageCarousel.example.css b/src/components/ImageCarousel/ImageCarousel.example.css
new file mode 100644
index 00000000..a4187e9e
--- /dev/null
+++ b/src/components/ImageCarousel/ImageCarousel.example.css
@@ -0,0 +1,12 @@
+@import '../../marketplace.css';
+
+.root {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding: 0;
+
+  @media (--viewportMedium) {
+    padding: 100px 10vw;
+  }
+}
diff --git a/src/components/ImageCarousel/ImageCarousel.example.js b/src/components/ImageCarousel/ImageCarousel.example.js
index 94229a49..3831dd8e 100644
--- a/src/components/ImageCarousel/ImageCarousel.example.js
+++ b/src/components/ImageCarousel/ImageCarousel.example.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import { types as sdkTypes } from '../../util/sdkLoader';
 import ImageCarousel from './ImageCarousel';
+import css from './ImageCarousel.example.css';
 
 const { UUID } = sdkTypes;
 
@@ -122,15 +123,15 @@ const ImageCarouselWrapper = props => {
 
 export const NoImages = {
   component: ImageCarouselWrapper,
-  props: { images: [] },
+  props: { images: [], rootClassName: css.root },
 };
 
 export const SingleImage = {
   component: ImageCarouselWrapper,
-  props: { images: [imageSquare] },
+  props: { images: [imageSquare], rootClassName: css.root },
 };
 
 export const MultipleImages = {
   component: ImageCarouselWrapper,
-  props: { images: [imageLandscape, imagePortrait, imageSquare] },
+  props: { images: [imageLandscape, imagePortrait, imageSquare], rootClassName: css.root },
 };