scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-23 07:38:07 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

pass join flow image background classes through to relevant steps

Browse source
This commit is contained in:
Ben Wheeler 2019-10-03 19:25:56 -04:00
parent 6da150d02e
commit e27a7cdbbc
5 changed files with 12 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/components/join-flow/birthdate-step.jsx
View file

@ -90,6 +90,7 @@ class BirthDateStep extends React.Component {
} = props;
return (
<JoinFlowStep
headerImgClass="birthdate-step-image"
headerImgSrc="/images/join-flow/birthdate-header.png"
innerClassName="join-flow-inner-birthdate-step"
title={this.props.intl.formatMessage({id: 'registration.birthDateStepTitle'})}

1
src/components/join-flow/country-step.jsx
View file

@ -69,6 +69,7 @@ class CountryStep extends React.Component {
} = props;
return (
<JoinFlowStep
headerImgClass="country-step-image"
headerImgSrc="/images/join-flow/country-header.png"
innerClassName="join-flow-inner-country-step"
title={this.props.intl.formatMessage({id: 'registration.countryStepTitle'})}

1
src/components/join-flow/email-step.jsx
View file

@ -151,6 +151,7 @@ class EmailStep extends React.Component {
}}
/>
)}
headerImgClass="email-step-image"
headerImgSrc="/images/join-flow/email-header.png"
innerClassName="join-flow-inner-email-step"
nextButton={this.props.intl.formatMessage({id: 'registration.createAccount'})}

9
src/components/join-flow/join-flow-step.jsx
View file

@ -14,6 +14,7 @@ const JoinFlowStep = ({
description,
descriptionClassName,
footerContent,
headerImgClass,
headerImgSrc,
nextButton,
onSubmit,
@ -24,7 +25,12 @@ const JoinFlowStep = ({
<form onSubmit={onSubmit}>
<div className="join-flow-outer-content">
{headerImgSrc && (
<div className="join-flow-header-image-wrapper">
<div
className={classNames(
'join-flow-header-image-wrapper',
headerImgClass
)}
>
<img
className="join-flow-header-image"
src={headerImgSrc}
@ -80,6 +86,7 @@ JoinFlowStep.propTypes = {
description: PropTypes.string,
descriptionClassName: PropTypes.string,
footerContent: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
headerImgClass: PropTypes.string,
headerImgSrc: PropTypes.string,
innerClassName: PropTypes.string,
nextButton: PropTypes.node,

1
src/components/join-flow/welcome-step.jsx
View file

@ -43,6 +43,7 @@ class WelcomeStep extends React.Component {
id: 'registration.welcomeStepDescriptionNonEducator'
})}
descriptionClassName="join-flow-welcome-description"
headerImgClass="welcome-step-image"
headerImgSrc="/images/join-flow/welcome-header.png"
innerClassName="join-flow-inner-welcome-step"
nextButton={this.props.createProjectOnComplete ? (