53 lines
1.8 KiB
JavaScript
53 lines
1.8 KiB
JavaScript
import React from 'react';
|
|
import injectSheet from 'react-jss';
|
|
import PropTypes from 'prop-types';
|
|
import textMarkup from 'src/jss/textMarkup.js';
|
|
import SignUpPay from 'src/js/components/SignUpPay.js';
|
|
import { connect } from 'react-redux';
|
|
import * as actions from 'src/js/actions/index.js';
|
|
import imgDonate from 'img/paypal-donate-button-doodle3d-QR-code.png';
|
|
import imgPayPal from 'img/btnPayPal.png';
|
|
import imgMollie from 'img/btnMollie.png';
|
|
import imgHeart from 'img/heart.jpg';
|
|
|
|
const styles = {
|
|
...textMarkup,
|
|
|
|
floatRight: {
|
|
float: "right",
|
|
marginLeft: "20px"
|
|
},
|
|
|
|
floatLeft: {
|
|
float: "left",
|
|
marginRight: "20px"
|
|
}
|
|
};
|
|
|
|
const Donate = ({ classes, onClose }) => (
|
|
<SignUpPay onClose={onClose} medium >
|
|
<div className={`${classes.text}`}>
|
|
<h2>Love Doodle3D?</h2>
|
|
<img src={imgHeart} width="200" className={classes.floatLeft}/>
|
|
<a className={classes.floatRight} href="https://www.paypal.com/donate?hosted_button_id=EWJPZ9ZCJU4GE" target="_blank"><img src={imgDonate} height="150"/></a>
|
|
<p>Do you also love Doodle3D Transform and want to help keeping it online?</p>
|
|
<p>Your donation helps. Please click one of the buttons below or scan the QR-code.</p>
|
|
<p>Thank you so much!</p>
|
|
<br/>
|
|
<div align="center">
|
|
<a href="https://useplink.com/payment/FN2SAUblA50f1PlXG2W3w/" target="_blank"><img src={imgMollie} height="50" /></a>
|
|
|
|
<a href="https://www.paypal.com/donate?hosted_button_id=EWJPZ9ZCJU4GE" target="_blank"><img src={imgPayPal} height="50"/></a>
|
|
</div>
|
|
</div>
|
|
</SignUpPay>
|
|
);
|
|
Donate.propTypes = {
|
|
classes: PropTypes.objectOf(PropTypes.string),
|
|
onClose: PropTypes.func.isRequired
|
|
};
|
|
|
|
export default connect(null, dispatch => ({
|
|
onClose: () => dispatch(actions.router.push(`/`))
|
|
}))(injectSheet(styles)(Donate));
|