Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Onboarding: Fix alignment of container on benefits screen. (https://github.com/woocommerce/woocommerce-admin/pull/4837)

This commit is contained in:
Timmy Crawford 2020-07-21 14:03:34 -07:00 committed by GitHub
parent e2d41ea718
commit ae6f5d4615
2 changed files with 8 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
plugins/woocommerce-admin/client/profile-wizard/index.js
View File

@ -288,6 +288,7 @@ class ProfileWizard extends Component {
render() { render() {
const { query } = this.props; const { query } = this.props;
const step = this.getCurrentStep(); const step = this.getCurrentStep();
const stepKey = step.key;
const container = createElement( step.container, { const container = createElement( step.container, {
query, query,
@ -300,13 +301,12 @@ class ProfileWizard extends Component {
const steps = this.getSteps().map( ( _step ) => const steps = this.getSteps().map( ( _step ) =>
pick( _step, [ 'key', 'label', 'isComplete' ] ) pick( _step, [ 'key', 'label', 'isComplete' ] )
); );
const classNames = `woocommerce-profile-wizard__container ${ stepKey }`;
return ( return (
<Fragment> <Fragment>
<ProfileWizardHeader currentStep={ step.key } steps={ steps } /> <ProfileWizardHeader currentStep={ stepKey } steps={ steps } />
<div className="woocommerce-profile-wizard__container"> <div className={ classNames }>{ container }</div>
{ container }
</div>
</Fragment> </Fragment>
); );
} }

4
plugins/woocommerce-admin/client/profile-wizard/style.scss
View File

@ -85,6 +85,10 @@
margin-right: auto; margin-right: auto;
} }
&.benefits {
text-align: center;
}
@include breakpoint( '<782px' ) { @include breakpoint( '<782px' ) {
padding-left: $gap; padding-left: $gap;
padding-right: $gap; padding-right: $gap;