From 9e1cac2bccf742cce2428b371c8a7afd0151b29d Mon Sep 17 00:00:00 2001
From: Rosie Storey <rstorey@loc.gov>
Date: Thu, 23 May 2019 16:46:57 -0400
Subject: [PATCH] Carousel item for activity UI

---
 concordia/static/scss/base.scss |  1 +
 concordia/templates/home.html   | 15 ++++++++++-----
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/concordia/static/scss/base.scss b/concordia/static/scss/base.scss
index ad32a1615..0dab657a5 100644
--- a/concordia/static/scss/base.scss
+++ b/concordia/static/scss/base.scss
@@ -613,6 +613,7 @@ ul.nav-secondary {
 
 .view-homepage .carousel-indicators .active {
     background: url('data:image/svg+xml;charset=utf8,%3Csvg%20height%3D%2212%22%20viewBox%3D%220%200%2012%2012%22%20width%3D%2212%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Ccircle%20cx%3D%226%22%20cy%3D%226%22%20fill%3D%22%23F05129%22%20fill-rule%3D%22evenodd%22%20r%3D%225.5%22%20stroke%3D%22%23fff%22/%3E%3C/svg%3E');
+    background-repeat: no-repeat;
 }
 
 .view-homepage .carousel-control-next,
diff --git a/concordia/templates/home.html b/concordia/templates/home.html
index ddbbc7a46..e50c18a64 100644
--- a/concordia/templates/home.html
+++ b/concordia/templates/home.html
@@ -30,6 +30,11 @@
                         <div class="carousel-item active" data-title="Memorial Day Challenge" data-hero-text="Make it meaningful by reviewing soldiers' stories of service and sacrifice." data-link-url="{% url 'transcriptions:redirect-to-next-reviewable-asset' 'civil-war-soldiers-disabled-but-not-disheartened' %}">
                             <img class="d-block w-100" src="{% static 'img/homepage-carousel/mem-day-challenge.jpg' %}" alt="Ornate left-handed penmanship specimen submitted by Alfred D. Whitehouse in which photograph portrait of Whitehouse is surrounded by caligraphy dedicating his work to his Union regiment. Whitehouse has a mustache and sideburns and wears a suit and bowtie.">
                         </div>
+                        {% if ADVERTISE_ACTIVITY_UI %}
+                            <div class="carousel-item" data-overlay-position="top-right" data-title="Find your perfect page" data-hero-text="Log in or register to transcribe and review in our new way of browsing" data-link-url="{% url 'action-app' %}">
+                                <img class="d-block w-100" src="{% static 'img/homepage-carousel/activity-ui.jpg' %}" alt="New crowdsourcing browse interface. Two rows of pages volunteers can choose from to review.">
+                            </div>
+                        {% endif %}
                         <div class="carousel-item" data-title="Walt Whitman at 200" data-hero-text="Transcribe and review poetry, letters, and writings of Walt Whitman. Discover how he wrote and lived for yourself." data-link-url="{% url 'transcriptions:redirect-to-next-transcribable-asset' 'walt-whitman' %}">
                             <img class="d-block w-100" src="{% static 'img/homepage-carousel/whitman.jpg' %}" alt="Walt Whitman in his younger years, a black and white engraving. Whitman with his right hand on his hip and his left in his pocket wearing a black rimmed hat.">
                         </div>
@@ -43,6 +48,11 @@
                         <div class="carousel-item active" data-title="Walt Whitman at 200" data-hero-text="Transcribe and review poetry, letters, and writings of Walt Whitman. Discover how he wrote and lived for yourself." data-link-url="{% url 'transcriptions:redirect-to-next-transcribable-asset' 'walt-whitman' %}">
                             <img class="d-block w-100" src="{% static 'img/homepage-carousel/whitman.jpg' %}" alt="Walt Whitman in his younger years, a black and white engraving. Whitman with his right hand on his hip and his left in his pocket wearing a black rimmed hat.">
                         </div>
+                        {% if ADVERTISE_ACTIVITY_UI %}
+                            <div class="carousel-item" data-overlay-position="top-right" data-title="Find your perfect page" data-hero-text="Log in or register to transcribe and review in our new way of browsing" data-link-url="{% url 'action-app' %}">
+                                <img class="d-block w-100" src="{% static 'img/homepage-carousel/activity-ui.jpg' %}" alt="New crowdsourcing browse interface. Two rows of pages volunteers can choose from to review.">
+                            </div>
+                        {% endif %}
                         <div class="carousel-item" data-overlay-position="top-right" data-title="Review Now" data-hero-text="Approve or correct other volunteers' transcriptions to help them cross the finish line." data-link-url="{% url 'transcriptions:redirect-to-next-reviewable-asset' 'mary-church-terrell-advocate-for-african-americans-and-women' %}">
                             <img class="d-block w-100" src="{% static 'img/homepage-carousel/review.jpg' %}" alt="Close up of hand-written text of Mary Church Terrell's first speech to the NAACP">
                         </div>
@@ -53,11 +63,6 @@
                             <img class="d-block w-100" src="{% static 'img/homepage-carousel/crowd-home.jpg' %}" alt="A crowd of young women cheering and waving handkerchiefs">
                         </div>
                     {% endif %}
-                    {% if ADVERTISE_ACTIVITY_UI %}
-                        <div class="carousel-item" data-overlay-position="top-right" data-title="We made a thing" data-hero-text="Please try out this thing we made for you, our volunteers" data-link-url="{% url 'action-app' %}">
-                            <img class="d-block w-100" src="{% static 'img/homepage-carousel/crowd-home.jpg' %}" alt="A crowd of young women cheering and waving handkerchiefs">
-                        </div>
-                    {% endif %}
                 </div>
                 <a class="carousel-control-prev" href="#homepage-carousel" role="button" data-slide="prev">
                     <span class="carousel-control-prev-icon" aria-hidden="true"></span>