# react-native-colorful-card > Fully customizable colorful card component for React Native. Latest version **0.1.5** (published 2021-02-24) · MIT license · 0 weekly downloads ## Install ```sh npm install react-native-colorful-card pnpm add react-native-colorful-card yarn add react-native-colorful-card bun add react-native-colorful-card ``` ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support; pre 1.0. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 0.1.5 | | Published | 2021-02-24 | | First published | 2021-02-18 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 0 | | Unpacked size | 39.3 KB | | Known vulnerabilities | 0 | | Install scripts | no | | Author | FreakyCoder | | Maintainers | freakycoder | | Keywords | colorful-card, card, FreakyCoder, freakycoder, kuray, Kuray, react, react-native, javascript, ui-lib, rn | ## Links - npm: https://www.npmjs.com/package/react-native-colorful-card - Repository: https://github.com/WrathChaos/react-native-colorful-card - Homepage: https://www.freakycoder.com - Issues: https://github.com/WrathChaos/react-native-colorful-card/issues - npm.io page: https://npm.io/package/react-native-colorful-card ## Alternatives - [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads - [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads - [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads - [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads - [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads ## Recent versions - 0.1.5 (latest) — 2021-02-24 - 0.1.4 — 2021-02-18 - 0.1.3 — 2021-02-18 ## README React Native Colorful Card [![Battle Tested ✅](https://img.shields.io/badge/-Battle--Tested%20%E2%9C%85-03666e?style=for-the-badge)](https://github.com/WrathChaos/react-native-colorful-card) [![React Native Colorful Card](https://img.shields.io/badge/-Fully%20customizable%20colorful%20card%20component%20for%20React%20Native.-orange?style=for-the-badge)](https://github.com/WrathChaos/react-native-colorful-card) [![npm version](https://img.shields.io/npm/v/react-native-colorful-card.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-colorful-card) [![npm](https://img.shields.io/npm/dt/react-native-colorful-card.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-colorful-card) ![Platform - Android and iOS](https://img.shields.io/badge/platform-Android%20%7C%20iOS-blue.svg?style=for-the-badge) [![License: MIT](https://img.shields.io/badge/License-MIT-green.svg?style=for-the-badge)](https://opensource.org/licenses/MIT) [![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg?style=for-the-badge)](https://github.com/prettier/prettier)
React Native Social Login Screen React Native Social Login Screen
# Installation Add the dependency: ```bash npm i react-native-colorful-card ``` ## Peer Dependencies
IMPORTANT! You need install them
```js "react-native-bounceable": ">= 0.2.4" ``` # Usage ## Import ```jsx import ColorfulCard from "react-native-colorful-card"; ``` ## Fundamental Usage ```jsx {}} /> ``` ## Example Project 😍 You can checkout the example project 🥰 Simply run - `npm i` - `react-native run-ios/android` should work of the example project. # Configuration - Props ## Fundamentals | Property | Type | Default | Description | | --------------- | :------: | :-------: | ------------------------------------------------------------------ | | title | string | undefined | change the title string | | value | string | undefined | change the value string | | valuePostfix | string | undefined | change the value postfix string | | footerTitle | string | undefined | change the footerTitle string | | footerValue | string | undefined | change the footerValue string | | iconImageSource | image | undefined | set your own image source for the icon | | onPress | function | undefined | set your own logic for the button functionality when it is pressed | ## Customization (Optionals) | Property | Type | Default | Description | | --------------------- | :--------: | :-----: | ---------------------------------------------------------------------- | | style | ViewStyle | default | set or override the style object for the main container | | iconImageStyle | ImageStyle | default | set or override the image style object for the icon container | | titleTextStyle | TextStyle | default | set or override the text style object for the title text | | footerTextStyle | TextStyle | default | set or override the text style object for the footer text | | valueTextStyle | TextStyle | default | set or override the text style object for the value text | | valuePostfixTextStyle | TextStyle | default | set or override the text style object for the value postfix text | | ImageComponent | Image | default | set your own component instead of default react-native Image component | | iconContainerStyle | ViewStyle | default | set or override the style object for the icon container style | ## Future Plans - [x] ~~LICENSE~~ - [ ] Write an article about the lib on Medium ## Author FreakyCoder, kurayogun@gmail.com ## Credits Heavily inspired by [WebFrontEndTips](http://webfrontendtips.blogspot.com/2020/01/how-to-design-fitness-app-ui-in-sketch.html) ## License React Native Colorful Card is available under the MIT license. See the LICENSE file for more info. --- _Source: https://npm.io/package/react-native-colorful-card · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._