greatbody
/
freeCodeCamp
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

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

pull/36297/head
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
Show Stats 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 (
<form
action='https://www.paypal.com/cgi-bin/webscr'
key={item.defaultValueHash}
method='post'
onSubmit={() =>
ReactGA.event({
@ -89,7 +90,7 @@ class DonateOther extends Component {
<Spacer />
<Grid>
<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'>
Other ways you can support our nonprofit
</h2>

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

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