gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix(client): Remove horizontal scrollbar from donation page (#36167)

Browse Source
This commit is contained in:
Oliver Eyton-Williams
2019-06-11 23:45:40 +02:00
committed by mrugesh
parent 84c46750e8
commit 2d780f257c
2 changed files with 28 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
client/src/components/Donation/components/DonateOther.js
View File

@ -55,6 +55,7 @@ class DonateOther extends Component {
return ( return (
<form <form
action='https://www.paypal.com/cgi-bin/webscr' action='https://www.paypal.com/cgi-bin/webscr'
key={item.defaultValueHash}
method='post' method='post'
onSubmit={() => onSubmit={() =>
ReactGA.event({ ReactGA.event({
@ -89,7 +90,7 @@ class DonateOther extends Component {
<Spacer /> <Spacer />
<Grid> <Grid>
<Row> <Row>
<Col md={6} mdOffset={3} sm={10} smOffset={1} xs={12}> <Col lg={8} lgOffset={2} sm={10} smOffset={1} xs={12}>
<h2 className='text-center'> <h2 className='text-center'>
Other ways you can support our nonprofit Other ways you can support our nonprofit
</h2> </h2>

12
client/src/pages/donate.js
View File

@ -1,7 +1,7 @@
import React, { Component, Fragment } from 'react'; import React, { Component, Fragment } from 'react';
import Helmet from 'react-helmet'; import Helmet from 'react-helmet';
import { StripeProvider, Elements } from 'react-stripe-elements'; import { StripeProvider, Elements } from 'react-stripe-elements';
import { Row, Col, Button } from '@freecodecamp/react-bootstrap'; import { Grid, Row, Col, Button } from '@freecodecamp/react-bootstrap';
import { stripePublicKey } from '../../config/env.json'; import { stripePublicKey } from '../../config/env.json';
@ -66,12 +66,13 @@ class DonatePage extends Component {
<Fragment> <Fragment>
<Helmet title='Support our nonprofit | freeCodeCamp.org' /> <Helmet title='Support our nonprofit | freeCodeCamp.org' />
<Spacer /> <Spacer />
<Grid>
<Row> <Row>
<Col sm={8} smOffset={2} xs={12}> <Col sm={10} smOffset={1} xs={12}>
<h2 className='text-center'>Become a Supporter</h2> <h2 className='text-center'>Become a Supporter</h2>
<DonateText /> <DonateText />
</Col> </Col>
<Col sm={6} smOffset={3} xs={12}> <Col md={8} mdOffset={2} sm={10} smOffset={1} xs={12}>
<hr /> <hr />
<StripeProvider stripe={stripe}> <StripeProvider stripe={stripe}>
<Elements> <Elements>
@ -82,12 +83,15 @@ class DonatePage extends Component {
<PoweredByStripe /> <PoweredByStripe />
<Spacer /> <Spacer />
<Button onClick={this.toggleOtherOptions}> <Button onClick={this.toggleOtherOptions}>
{`${showOtherOptions ? 'Hide' : 'Show'} other ways to donate.`} {`${
showOtherOptions ? 'Hide' : 'Show'
} other ways to donate.`}
</Button> </Button>
</div> </div>
<Spacer /> <Spacer />
</Col> </Col>
</Row> </Row>
</Grid>
{showOtherOptions && <DonateOther />} {showOtherOptions && <DonateOther />}
</Fragment> </Fragment>
); );