From 3e04062da1d893dc5f21da2ea45e4babcd4b92fb Mon Sep 17 00:00:00 2001
From: Jack Zhang <jack@zulipchat.com>
Date: Thu, 20 Jul 2017 18:15:18 -0700
Subject: [PATCH] Show name of integration in mobile single-integration view.

---
 static/js/portico/landing-page.js        |  1 +
 static/styles/landing-page.css           | 16 ++++++++++++++--
 templates/zerver/integrations/index.html |  1 +
 3 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/static/js/portico/landing-page.js b/static/js/portico/landing-page.js
index 0656d3fb4d..611fa78ced 100644
--- a/static/js/portico/landing-page.js
+++ b/static/js/portico/landing-page.js
@@ -125,6 +125,7 @@ function hide_catalog_show_integration() {
     var $lozenge_icon = $(".integration-lozenge.integration-" + state.integration).clone(false);
 
     function show_integration(doc) {
+        $('#integration-instructions-group .name').text(INTEGRATIONS[state.integration]);
         $('#integration-instructions-group').css({
             opacity: 0,
             display: 'block',
diff --git a/static/styles/landing-page.css b/static/styles/landing-page.css
index d136dcd444..ba2d7387dc 100644
--- a/static/styles/landing-page.css
+++ b/static/styles/landing-page.css
@@ -2046,6 +2046,14 @@ nav ul li.active::after {
     display: none;
 }
 
+.portico-landing.integrations .integration-instruction-block .name {
+    display: none;
+    font-size: 1.4em;
+    font-weight: 400;
+    margin: 0;
+    padding-bottom: 35px;
+}
+
 /* -- gradients -- */
 .gradients {
     width: 100%;
@@ -2427,8 +2435,8 @@ nav ul li.active::after {
     }
 
     #integration-list-link {
-        top: -40px;
-        left: 35px;
+        top: 33px;
+        left: -7px;
     }
 
     .integration-instructions {
@@ -2448,6 +2456,10 @@ nav ul li.active::after {
         margin: 0 auto;
     }
 
+    .portico-landing.integrations .integration-instruction-block .name {
+        display: block;
+    }
+
     .platform.image {
         display: none !important;
     }
diff --git a/templates/zerver/integrations/index.html b/templates/zerver/integrations/index.html
index 64342df7f3..83b0ed0baa 100644
--- a/templates/zerver/integrations/index.html
+++ b/templates/zerver/integrations/index.html
@@ -118,6 +118,7 @@
                 <div id="integration-instructions-group">
                     <div id="integration-instruction-block" class="integration-instruction-block">
                         <a href="/integrations" id="integration-list-link"><i class="icon-vector-circle-arrow-left"></i><span>Back to list</span></a>
+                        <h3 class="name"></h3>
                     </div>
 
                     {% for integration in integrations_dict.values() %}