From a49364bbb57017e246e3498e41c5db2f0d9726c9 Mon Sep 17 00:00:00 2001
From: Zainab Amir <zainab.amir@arbisoft.com>
Date: Mon, 14 Jun 2021 14:30:47 +0500
Subject: [PATCH] fix: update class for legal text (#337)

updated paragon package to the latest version
removed .small from legal text and replaced it with .micro
fixed the spinner to be center aligned on buttons during pending state

VAN-545
---
 package-lock.json                            | 6 +++---
 package.json                                 | 2 +-
 src/login/tests/LoginPage.test.jsx           | 3 +--
 src/register/RegistrationPage.jsx            | 6 +++---
 src/register/tests/RegistrationPage.test.jsx | 3 +--
 5 files changed, 9 insertions(+), 11 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6ed75fa2..fa4318cb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3937,9 +3937,9 @@
       }
     },
     "@edx/paragon": {
-      "version": "14.15.0",
-      "resolved": "https://registry.npmjs.org/@edx/paragon/-/paragon-14.15.0.tgz",
-      "integrity": "sha512-g8Otnqj/bg+z6z/wcD04XPguASy3OwTi+947Qq/zrSMMaRG4xKraWCZVP0HZ5NTKTKh/GkQGsm7G6PPiUu5Ulg==",
+      "version": "14.16.0",
+      "resolved": "https://registry.npmjs.org/@edx/paragon/-/paragon-14.16.0.tgz",
+      "integrity": "sha512-KYGuaQvSg0mo+qFAwz40LE3uf/uMedw6QFqZ0RmEXL9xhavGlRC+kT8NfJ5npyE4HkS181FbSMVbdR9jEHGiBw==",
       "requires": {
         "@fortawesome/fontawesome-svg-core": "^1.2.30",
         "@fortawesome/free-solid-svg-icons": "^5.14.0",
diff --git a/package.json b/package.json
index 35b87e72..a8d77c0b 100644
--- a/package.json
+++ b/package.json
@@ -38,7 +38,7 @@
     "@edx/frontend-component-cookie-policy-banner": "2.1.12",
     "@edx/frontend-component-header": "2.2.5",
     "@edx/frontend-platform": "1.8.4",
-    "@edx/paragon": "14.15.0",
+    "@edx/paragon": "14.16.0",
     "@fortawesome/fontawesome-svg-core": "1.2.32",
     "@fortawesome/free-brands-svg-icons": "5.15.1",
     "@fortawesome/free-regular-svg-icons": "5.15.1",
diff --git a/src/login/tests/LoginPage.test.jsx b/src/login/tests/LoginPage.test.jsx
index 39e7348e..3dc15bfc 100644
--- a/src/login/tests/LoginPage.test.jsx
+++ b/src/login/tests/LoginPage.test.jsx
@@ -160,8 +160,7 @@ describe('LoginPage', () => {
     const loginPage = mount(reduxWrapper(<IntlLoginPage {...props} />));
     const button = loginPage.find('button[type="submit"] span').first();
 
-    // test pending state has icon
-    expect(button.find('.pgn__stateful-btn-icon').length).toEqual(1);
+    expect(button.find('.sr-only').text()).toEqual('pending');
   });
 
   it('should show forgot password link', () => {
diff --git a/src/register/RegistrationPage.jsx b/src/register/RegistrationPage.jsx
index 7b3b40a2..1bde373a 100644
--- a/src/register/RegistrationPage.jsx
+++ b/src/register/RegistrationPage.jsx
@@ -540,7 +540,7 @@ class RegistrationPage extends React.Component {
               handleChange={(value) => this.setState({ country: value })}
               errorCode={this.state.errorCode}
             />
-            <div id="honor-code" className="small mt-4">
+            <div id="honor-code" className="micro mt-4">
               <FormattedMessage
                 id="register.page.terms.of.service.and.honor.code"
                 defaultMessage="By creating an account, you agree to the {tosAndHonorCode} and you acknowledge that {platformName} and each
@@ -549,12 +549,12 @@ class RegistrationPage extends React.Component {
                 values={{
                   platformName: getConfig().SITE_NAME,
                   tosAndHonorCode: (
-                    <Hyperlink destination={getConfig().TOS_AND_HONOR_CODE || '#'} target="_blank">
+                    <Hyperlink variant="muted" destination={getConfig().TOS_AND_HONOR_CODE || '#'} target="_blank">
                       {intl.formatMessage(messages['terms.of.service.and.honor.code'])}
                     </Hyperlink>
                   ),
                   privacyPolicy: (
-                    <Hyperlink destination={getConfig().PRIVACY_POLICY || '#'} target="_blank">
+                    <Hyperlink variant="muted" destination={getConfig().PRIVACY_POLICY || '#'} target="_blank">
                       {intl.formatMessage(messages['privacy.policy'])}
                     </Hyperlink>
                   ),
diff --git a/src/register/tests/RegistrationPage.test.jsx b/src/register/tests/RegistrationPage.test.jsx
index 6e33fa71..5d7115f0 100644
--- a/src/register/tests/RegistrationPage.test.jsx
+++ b/src/register/tests/RegistrationPage.test.jsx
@@ -398,8 +398,7 @@ describe('RegistrationPage', () => {
       const registrationPage = mount(reduxWrapper(<IntlRegistrationPage {...props} />));
       const button = registrationPage.find('button[type="submit"] span').first();
 
-      // test pending state has icon
-      expect(button.find('.pgn__stateful-btn-icon').length).toEqual(1);
+      expect(button.find('.sr-only').text()).toEqual('pending');
     });
 
     it('should show single sign on provider button', () => {