From a310c87d8e9f4a46a857e8128d67a40005838f73 Mon Sep 17 00:00:00 2001
From: Waheed Ahmed <waheed.ahmed@arbisoft.com>
Date: Tue, 16 Jul 2019 15:08:58 +0500
Subject: [PATCH] Move secondary SSO login button.

Moved secondary SSO login button to the top of email and
password fields.

PROD-478
---
 .../js/student_account/views/LoginView.js     |  1 +
 lms/static/sass/views/_login-register.scss    |  8 ++++---
 .../student_account/login.underscore          | 22 ++++++++++++-------
 3 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/lms/static/js/student_account/views/LoginView.js b/lms/static/js/student_account/views/LoginView.js
index 99ee8c4564..477aa7d197 100644
--- a/lms/static/js/student_account/views/LoginView.js
+++ b/lms/static/js/student_account/views/LoginView.js
@@ -69,6 +69,7 @@
                         _.template(this.tpl)({
                             // We pass the context object to the template so that
                             // we can perform variable interpolation using sprintf
+                            HtmlUtils: HtmlUtils,
                             context: {
                                 fields: fields,
                                 currentProvider: this.currentProvider,
diff --git a/lms/static/sass/views/_login-register.scss b/lms/static/sass/views/_login-register.scss
index e0867237e0..74f71ca1e6 100644
--- a/lms/static/sass/views/_login-register.scss
+++ b/lms/static/sass/views/_login-register.scss
@@ -637,12 +637,14 @@
     @extend %t-action4;
     @extend %t-regular;
 
-    border-color: $lightGrey1;
+    font-size: 1rem;
+    font-weight: 600;
     padding: 0;
-    height: $third-party-button-height;
 
     &:hover {
       border-color: $m-blue-d3;
+      box-shadow: none;
+
     }
   }
 
@@ -797,7 +799,7 @@
     &:first-of-type {
       margin-top: 20px;
     }
-        
+
     font-size: 16px;
     line-height: 1.5;
     color: $gray-d2;
diff --git a/lms/templates/student_account/login.underscore b/lms/templates/student_account/login.underscore
index 0a2672e789..58023fd5d5 100644
--- a/lms/templates/student_account/login.underscore
+++ b/lms/templates/student_account/login.underscore
@@ -38,11 +38,23 @@
         <%- gettext("If you do not yet have an account, use the button below to register.") %>
     </p>
 
-    <%= context.fields %>
+    <% if ( context.hasSecondaryProviders ) { %>
+        <button type="button" class="button-secondary-login form-toggle" data-type="institution_login">
+            <%- gettext("Use my university info") %>
+        </button>
+
+        <div class="section-title lines">
+            <h3>
+                <span class="text"><%- gettext("or sign in with") %></span>
+            </h3>
+        </div>
+    <% } %>
+
+    <%= HtmlUtils.HTML(context.fields) %>
 
     <button type="submit" class="action action-primary action-update js-login login-button"><%- gettext("Sign in") %></button>
 
-    <% if ( context.providers.length > 0 && !context.currentProvider || context.hasSecondaryProviders ) { %>
+    <% if ( context.providers.length > 0 && !context.currentProvider) { %>
     <div class="login-providers">
         <div class="section-title lines">
             <h3>
@@ -63,12 +75,6 @@
                 </button>
             <% }
         }); %>
-
-        <% if ( context.hasSecondaryProviders ) { %>
-            <button type="button" class="button-secondary-login form-toggle" data-type="institution_login">
-                <%- gettext("Use my institution/campus credentials") %>
-            </button>
-        <% } %>
     </div>
     <% } %>
 </form>