https://github.com/joseph625/card-picker
React card picker, it's simple and small size slider 🙂
https://github.com/joseph625/card-picker
css javascript
Last synced: about 1 year ago
JSON representation
React card picker, it's simple and small size slider 🙂
- Host: GitHub
- URL: https://github.com/joseph625/card-picker
- Owner: joseph625
- License: mit
- Created: 2022-10-16T13:10:59.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2022-10-29T12:28:04.000Z (over 3 years ago)
- Last Synced: 2025-05-01T10:04:30.993Z (about 1 year ago)
- Topics: css, javascript
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/card-picker
- Size: 2.26 MB
- Stars: 6
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Card Picker [](https://badge.fury.io/js/card-picker)
The smooth and pretty slider you can use this package for making your website unique 😉.
**card picker**:
- has NO DEPENDENCIES :)
- is completely free and open source.
## Table of Contents
- [Demo](#preview)
- [Install](#install)
- [Usage](#usage)
- [Browser Support](#browser-support)
- [License](#license)
# preview
[Example code](https://codesandbox.io/s/card-picker-demo-7yh6lb?file=/src/App.js)
> Simple and awesome 😎
## Install
```sh
# Install card picker with npm
$ npm install --save card-picker
# If you use react version < 18
$ npm install --save card-picker --force
```
## Usage
In a React app, use the Slider component:
`import { Slider } from 'card-picker'`
### Slider props
| Name | Description | Require
| ----------- | ----------- | ---------
| infinity | Boolean, default false | ✘
| height | String, default '100%' | ✘
| borderRadius | String, default '0px' | ✘
| previousButton | String, default arrow | ✘
| nextButton | String, default arrow | ✘
```html
#For previousButton and nextButton you can change default arrow for your svg, img, icon...etc
{
....
previousButton: '![]()
',
nextButton: '![]()
'
}
```
## Browser Support
Available in latest browsers.
## License
[MIT](LICENSE) © [Yousif Jasm](https://www.yousifjasm.me/)