fixed #365 issue

Author: sirakovaDimitrina

src/projects/detail/components/FeatureSelector/FeaturePreview.jsx

@@ -24,7 +24,9 @@ const FeaturePreview = props => {
   // }
   return (
     <div className="feature-preview flex-grow">
-      <img src={ previewImg } />
+      <div className="feature-preview-img">
+        <img src={ previewImg } />
+      </div>
     </div>
   )
 }

src/projects/detail/components/FeatureSelector/FeaturePreview.scss

@@ -2,14 +2,20 @@
 
 .feature-preview {
   text-align: center;
-  padding: (8 * $base-unit) (12 * $base-unit) ;
-  background: url('./images/Device-iPhone.svg') no-repeat;
+  /*padding: (8 * $base-unit) (12 * $base-unit) ;*/
+  /*background: url('./images/Device-iPhone.svg') no-repeat;*/
   background-color: #FBFDFF;
   background-position: 50% 22px;
-  padding-top: 88px;
+  padding: 8 * $base-unit;
   border-left: 1px solid $tc-dark-blue-30;
-
+  .feature-preview-img {
+    background: url('./images/Device-iPhone.svg') no-repeat;
+    /*padding: (8 * $base-unit) (12 * $base-unit) ;*/
+    padding: 9.18vh 1.57vw;
+    height: 78.5vh;
+    background-size: contain;
+  }
   img {
-    max-height: 500px;
+    max-height: 100%;
   }
 }