Add screenshots

common/static/common/js/components/UpsellExperimentModal.jsx

@@ -29,14 +29,29 @@ export class UpsellExperimentModal extends React.Component {
             (<div>
                 <div className="slide-header"><b>Course Activity Streak</b></div>
                 <span className="course-activity-streak-information">Did you know the learners most likely to complete a course log in every week? Let us help you track your weekly streak - log in every week and learn something new! You can also see how many of the other learners in your course logged in this week.</span>
+                <img
+                    className="feature-screenshot"
+                    src="https://prod-edx-mktg-edit.edx.org/sites/default/files/week_streak.png"
+                    alt=""
+                />
             </div>),
             (<div>
                 <div className="slide-header"><b>Grade Progress</b></div>
                 <span className="grade-progress-information">Wonder how you're doing in the course so far? We can not only show you all your grades, and how much each assignment is worth, but also upcoming graded assignments. This is a great way to track what you might need to work on for a final exam.</span>
+                <img
+                    className="feature-screenshot"
+                    src="https://prod-edx-mktg-edit.edx.org/sites/default/files/grading.png"
+                    alt=""
+                />
             </div>),
             (<div>
                 <div className="slide-header"><b>Discussion engagements</b></div>
                 <span className="discussion-engagements-information">A large percentage of successful learners are engaged on the discussion forums. Compare your forum stats to previous graduates!</span>
+                <img
+                    className="feature-screenshot"
+                    src="https://prod-edx-mktg-edit.edx.org/sites/default/files/discussions.png"
+                    alt=""
+                />
             </div>),
         ];
         const body = (

lms/static/sass/_experiments.scss

@@ -449,6 +449,7 @@
     left: 10px;
     position: absolute;
     color: black;
+    line-height: 24px;
   }
 
   .js-carousel-nav {
@@ -487,6 +488,14 @@
     padding-bottom: 10px;
   }
 
+  .feature-screenshot {
+    width: 250px;
+    margin-top: 15px;
+    margin-left: auto;
+    margin-right: auto;
+    padding-bottom: 15px;
+  }
+
   @media only screen and (max-width: 600px){
     .slick-slide.carousel-item {
       min-width: 0;