react-plastic
v1.1.1
Published
A no hassle react display for a card using only the css from jessepollak's Card (https://github.com/jessepollak/card). This does not use the javascript from this project, it is only to display static cards. If you need it to be interactive, I suggest usin
Downloads
254
Readme
react-plastic
A no hassle react display for a card using only the css from jessepollak's Card (https://github.com/jessepollak/card). This does not use the javascript from this project, it is only to display static cards. If you need it to be interactive, I suggest using another project for this (https://www.npmjs.com/package/card-react).
Attempts to make a best effort to scale the card. Look below for information on how to override this.
Packages
npm
npm install react-plastic
Usage
import React from 'react';
import Plastic from 'react-plastic';
export const ShowCard = () => (
<Plastic
type="amex"
name="Peter Sagan"
expiry="10/20"
number="444466666655555"
cvc="3333"
/>);
That's it! Depending on your setup, the CSS should be pulled in automagically.
Properties
type
- A string for the name that should appear on the card.- supported cards:
- any other value will appear as the default unknown card
expiry
- A string for the expiration date that should appear on the card- accepts either: 02/2020 or 02/20.
number
- A string for the card number that should appear on the cardname
- A string for the name that should appear on the cardcvc
- A string for the cvc that should appear front and back of the cardback
- A boolean to show the back of the card
Scaling
To override, you should be able to override the css for:
@media (max-width: <SIZE>px) { .card-wrapper {} }
CSS
If for some reason your styling isn't working, you may need to include:
node_modules/react-plastic/styles/card.css
Contributors
James Armstead
Contribute!
Be a part of this project! You can run the test using the following.
- Install dependencies from package.json by running
npm install
- Run the test via
npm test
- Contribute!
This project is licensed under the MIT License
Proudly written in Des Moines, Iowa.