Merge pull request #74 from edx/fix-branding-issues

fix missing branding issues
This commit is contained in:
Uzair Rasheed
2021-01-08 16:50:58 +05:00
committed by GitHub
12 changed files with 43 additions and 39 deletions

View File

@@ -56,7 +56,7 @@ const ForgotPasswordPage = (props) => {
{status === 'complete' ? <Redirect to={LOGIN_PAGE} /> : null}
<div className="d-flex justify-content-center m-4">
<div className="d-flex flex-column">
<Form className="mw-420">
<Form className="mw-500">
{status === 'forbidden' ? <RequestInProgressAlert /> : null}
<h1 className="mt-3">
{intl.formatMessage(messages['logisration.forgot.password.page.heading'])}

View File

@@ -8,7 +8,7 @@ exports[`ForgotPasswordPage should match default section snapshot 1`] = `
className="d-flex flex-column"
>
<form
className="mw-420"
className="mw-500"
>
<h1
className="mt-3"
@@ -112,7 +112,7 @@ exports[`ForgotPasswordPage should match forbidden section snapshot 1`] = `
className="d-flex flex-column"
>
<form
className="mw-420"
className="mw-500"
>
<div
className="fade alert alert-warning show"
@@ -241,7 +241,7 @@ exports[`ForgotPasswordPage should match pending section snapshot 1`] = `
className="d-flex flex-column"
>
<form
className="mw-420"
className="mw-500"
>
<h1
className="mt-3"

View File

@@ -10,7 +10,7 @@ export const RenderInstitutionButton = props => {
if (secondaryProviders !== undefined && secondaryProviders.length > 0) {
return (
<Button
className="mb-2 mt-2"
className="mt-2"
block
variant="outline-primary"
onClick={onSubmitHandler}

View File

@@ -142,7 +142,7 @@ class LoginPage extends React.Component {
/>
<div className="d-flex justify-content-center m-4">
<div className="d-flex flex-column">
<div className="mw-420">
<div className="mw-500">
{thirdPartyAuthContext.currentProvider
&& (
<ThirdPartyAuthAlert
@@ -170,7 +170,7 @@ class LoginPage extends React.Component {
secondaryProviders={thirdPartyAuthContext.secondaryProviders}
buttonTitle={intl.formatMessage(messages['logistration.login.institution.login.button'])}
/>
<div className="mb-4 mt-3">
<div className="mb-4 mt-20">
<h4>{intl.formatMessage(messages['logistration.or.sign.in.with'])}</h4>
</div>
</>
@@ -228,7 +228,7 @@ class LoginPage extends React.Component {
</Form>
{thirdPartyAuthContext.providers.length && !thirdPartyAuthContext.currentProvider ? (
<>
<div className="section-heading-line mb-4">
<div className="mb-4 mt-20">
<h4>{intl.formatMessage(messages['logistration.or.sign.in.with'])}</h4>
</div>
<div className="row tpa-container">

View File

@@ -236,6 +236,10 @@ $apple-focus-black: $apple-black;
height: 90%;
}
.mt-20 {
margin-top: 20px;
}
@media (min-width: 576px) {
.reset-password-container {
width: 420px;

View File

@@ -73,7 +73,7 @@ const messages = defineMessages({
},
'logistration.login.institution.login.page.back.button': {
id: 'logistration.login.institution.login.page.back.button',
defaultMessage: 'Back',
defaultMessage: 'Back to sign in',
description: 'return to login page',
},
'logistration.register.institution.login.button': {

View File

@@ -8,7 +8,7 @@ exports[`LoginPage should match TPA provider snapshot 1`] = `
className="d-flex flex-column"
>
<div
className="mw-420"
className="mw-500"
>
<div
className="d-flex flex-row"
@@ -154,7 +154,7 @@ exports[`LoginPage should match TPA provider snapshot 1`] = `
</button>
</form>
<div
className="section-heading-line mb-4"
className="mb-4 mt-20"
>
<h4>
or sign in with
@@ -200,7 +200,7 @@ exports[`LoginPage should match default section snapshot 1`] = `
className="d-flex flex-column"
>
<div
className="mw-420"
className="mw-500"
>
<div
className="d-flex flex-row"
@@ -358,7 +358,7 @@ exports[`LoginPage should match forget password alert message snapshot 1`] = `
className="d-flex flex-column"
>
<div
className="mw-420"
className="mw-500"
>
<div
className="d-flex flex-row"
@@ -516,7 +516,7 @@ exports[`LoginPage should match pending button state snapshot 1`] = `
className="d-flex flex-column"
>
<div
className="mw-420"
className="mw-500"
>
<div
className="d-flex flex-row"
@@ -683,7 +683,7 @@ exports[`LoginPage should show error message 1`] = `
className="d-flex flex-column"
>
<div
className="mw-420"
className="mw-500"
>
<div
className="fade alert alert-danger show"

View File

@@ -8,7 +8,7 @@ const ResetFailureMessage = (props) => {
return (
<div className="d-flex justify-content-center m-4">
<div className="d-flex flex-column">
<div className="text-center mw-420">
<div className="text-center mw-500">
<Alert variant="danger">
<FormattedMessage
id="logistration.reset.password.request.failure.header.message"

View File

@@ -77,12 +77,12 @@ const ResetPasswordPage = (props) => {
<>
{props.status === 'failure' ? <ResetFailureMessage errors={props.errors} /> : null}
<div className="d-flex justify-content-center m-4">
<div className="d-flex flex-column">
<div className="d-flex flex-column mw-500">
<Form>
<div className="reset-password-container">
<h3 className="text-center mt-3">
<h1 className="mt-3">
{intl.formatMessage(messages['logistration.reset.password.page.heading'])}
</h3>
</h1>
<p className="mb-4">
{intl.formatMessage(messages['logistration.reset.password.page.instructions'])}
</p>
@@ -126,7 +126,7 @@ const ResetPasswordPage = (props) => {
</div>
<StatefulButton
type="submit"
className="btn-primary submit"
className="btn-primary"
state={props.status}
labels={{
default: intl.formatMessage(messages['logistration.reset.password.page.submit.button']),

View File

@@ -16,7 +16,7 @@ const ResetSuccessMessage = () => {
return (
<div className="d-flex justify-content-center m-4">
<div className="d-flex flex-column">
<div className="text-center mw-420">
<div className="text-center mw-500">
<Alert variant="success">
<Alert.Heading className="text-success">
<FormattedMessage

View File

@@ -168,7 +168,7 @@ describe('ResetPasswordPage', () => {
resetPage.find('input#reset-password-input').simulate('blur', { target: { value: newPassword } });
});
resetPage.find('input#confirm-password-input').simulate('change', { target: { value: newPassword } });
resetPage.find('button.submit').simulate('click');
resetPage.find('button.btn-primary').simulate('click');
expect(store.dispatch).toHaveBeenCalledWith(resetPassword(formPayload, props.token, {}));
resetPage.unmount();

View File

@@ -50,7 +50,7 @@ exports[`ResetPasswordPage should match pending reset message section snapshot 1
className="d-flex justify-content-center m-4"
>
<div
className="d-flex flex-column"
className="d-flex flex-column mw-500"
>
<form
className=""
@@ -58,11 +58,11 @@ exports[`ResetPasswordPage should match pending reset message section snapshot 1
<div
className="reset-password-container"
>
<h3
className="text-center mt-3"
<h1
className="mt-3"
>
Reset Your Password
</h3>
</h1>
<p
className="mb-4"
>
@@ -121,7 +121,7 @@ exports[`ResetPasswordPage should match pending reset message section snapshot 1
<button
aria-disabled={true}
aria-live="assertive"
className="pgn__stateful-btn pgn__stateful-btn-state-pending btn-primary submit disabled btn btn-primary"
className="pgn__stateful-btn pgn__stateful-btn-state-pending btn-primary disabled btn btn-primary"
disabled={false}
onClick={[Function]}
type="submit"
@@ -151,7 +151,7 @@ exports[`ResetPasswordPage should match reset password default section snapshot
className="d-flex justify-content-center m-4"
>
<div
className="d-flex flex-column"
className="d-flex flex-column mw-500"
>
<form
className=""
@@ -159,11 +159,11 @@ exports[`ResetPasswordPage should match reset password default section snapshot
<div
className="reset-password-container"
>
<h3
className="text-center mt-3"
<h1
className="mt-3"
>
Reset Your Password
</h3>
</h1>
<p
className="mb-4"
>
@@ -222,7 +222,7 @@ exports[`ResetPasswordPage should match reset password default section snapshot
<button
aria-disabled={false}
aria-live="assertive"
className="pgn__stateful-btn pgn__stateful-btn-state-null btn-primary submit btn btn-primary"
className="pgn__stateful-btn pgn__stateful-btn-state-null btn-primary btn btn-primary"
disabled={false}
onClick={[Function]}
type="submit"
@@ -246,7 +246,7 @@ exports[`ResetPasswordPage should match successful reset message section snapsho
className="d-flex flex-column"
>
<div
className="text-center mw-420"
className="text-center mw-500"
>
<div
className="fade alert alert-success show"
@@ -287,7 +287,7 @@ Array [
className="d-flex flex-column"
>
<div
className="text-center mw-420"
className="text-center mw-500"
>
<div
className="fade alert alert-danger show"
@@ -304,7 +304,7 @@ Array [
className="d-flex justify-content-center m-4"
>
<div
className="d-flex flex-column"
className="d-flex flex-column mw-500"
>
<form
className=""
@@ -312,11 +312,11 @@ Array [
<div
className="reset-password-container"
>
<h3
className="text-center mt-3"
<h1
className="mt-3"
>
Reset Your Password
</h3>
</h1>
<p
className="mb-4"
>
@@ -375,7 +375,7 @@ Array [
<button
aria-disabled={false}
aria-live="assertive"
className="pgn__stateful-btn pgn__stateful-btn-state-failure btn-primary submit btn btn-primary"
className="pgn__stateful-btn pgn__stateful-btn-state-failure btn-primary btn btn-primary"
disabled={false}
onClick={[Function]}
type="submit"