README is here

Author: kuraydev

README.md

@@ -1,29 +1,28 @@
-<img alt="React Native Library Boilerplate" src="assets/logo.png" width="1050"/>
+<img alt="React Native Imaged Carousel Card" src="assets/logo.png" width="1050"/>
 
+[![Battle Tested ✅](https://img.shields.io/badge/-Battle--Tested%20%E2%9C%85-03666e?style=for-the-badge)](https://github.com/WrathChaos/react-native-imaged-carousel-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-library-boilerplate)
+[![Fully customizable & Lovely Imaged Carousel Card for React Native](https://img.shields.io/badge/-Fully%20customizable%20%26%20Lovely%20Imaged%20Carousel%20Card%20for%20React%20Native-lightgrey?style=for-the-badge)](https://github.com/WrathChaos/react-native-imaged-carousel-card)
 
-
-[![React Native Library Boiler Plate](https://img.shields.io/badge/-React%20Native%20Library%20Boilerplate-lightgrey?style=for-the-badge)](https://github.com/WrathChaos/react-native-library-boilerplate)
-
-
-[![npm version](https://img.shields.io/npm/v/react-native-library-boilerplate.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-library-boilerplate)
-[![npm](https://img.shields.io/npm/dt/react-native-library-boilerplate.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-library-boilerplate)
+[![npm version](https://img.shields.io/npm/v/react-native-imaged-carousel-card.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-imaged-carousel-card)
+[![npm](https://img.shields.io/npm/dt/react-native-imaged-carousel-card.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-imaged-carousel-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)
 
 <p align="center">
-  <img alt="React Native Library Boilerplate"
-        src="assets/Screenshots/JSLibraryBoilerplate.png" />
+  <img alt="React Native Imaged Carousel Card"
+        src="assets/Screenshots/ss2.png" width="49.7%" />
+  <img alt="React Native Imaged Carousel Card"
+        src="assets/Screenshots/ss3.png" width="49.7%" />
 </p>
 
 # Installation
 
 Add the dependency:
 
 ```ruby
-npm i react-native-library-boilerplate
+npm i react-native-imaged-carousel-card
 ```
 
 ## Peer Dependencies
@@ -40,37 +39,56 @@ npm i react-native-library-boilerplate
 ## Import
 
 ```js
-import { Component1, Component2 } from "react-native-library-boilerplate";
+import ImagedCarouselCard from "react-native-imaged-carousel-card";
 ```
 
-## Component1 Usage
+## Basic Usage
 
 ```js
-<Component1 />
+<ImagedCarouselCard />
+```
+
+## Advanced Usage
+
+```js
+<ImagedCarouselCard
+  width={200}
+  height={200}
+  shadowColor="#051934"
+  source={{
+    uri: "",
+  }}
+/>
 ```
 
 # Configuration - Props
 
-| Property |  Type   | Default | Description                                             |
-| -------- | :-----: | :-----: | ------------------------------------------------------- |
-| outline  | boolean |  true   | make the button outline                                 |
-| solid    | boolean |  false  | make the button with a solid background and a shadow    |
-| gradient | boolean |  false  | make the button with a gradient background and a shadow |
-| width    | number  |   150   | change the button's width                               |
+| Property                       |     Type      |         Default         | Description                                           |
+| ------------------------------ | :-----------: | :---------------------: | ----------------------------------------------------- |
+| text                           |    string     | California Festive 2020 | change the text                                       |
+| width                          | number/string |           300           | change the main card's width                          |
+| height                         | number/string |           300           | change the main card's height                         |
+| source                         |     asset     |         default         | change the main card's background source              |
+| borderRadius                   |    number     |           16            | change the main card's border radius                  |
+| textStyle                      |     style     |         default         | set your own text style                               |
+| shadowColor                    |     color     |          #000           | change the shadow color                               |
+| shadowStyle                    |     style     |         default         | set your own shadow style                             |
+| overlayHeight                  |    number     |           50            | change the black overlay's height                     |
+| overlayBackgroundColor         |     color     |     rgba(0,0,0,0.3)     | change the black overlay's background color           |
+| overlayBorderBottomLeftRadius  |    number     |           16            | change the black overlay's border bottom left radius  |
+| overlayBorderBottomRightRadius |    number     |           16            | change the black overlay's border bottom right radius |
+| shadowPaddingBottom            |    number     |           18            | This is a **need** for shadow but you can change it   |
 
 ## Future Plans
 
 - [x] ~~LICENSE~~
+- [ ] Typescript Challenge!
 - [ ] Write an article about the lib on Medium
 
-# Change Log
-
-Change log will be here !
-
 ## Author
 
 FreakyCoder, kurayogun@gmail.com
 
 ## License
 
-React Native Library Boilerplate is available under the MIT license. See the LICENSE file for more info.
+React Native Imaged Carousel Card is available under the MIT license. See the LICENSE file for more info.

assets/Screenshots/JSLibraryBoilerplate.png

@@ -24,6 +24,15 @@ const App = () => {
           }}
         >
           <ImagedCarouselCard />
+          <ImagedCarouselCard
+            height={200}
+            width={200}
+            shadowColor="#051934"
+            source={{
+              uri:
+                "https://images.unsplash.com/photo-1503891450247-ee5f8ec46dc3?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=634&q=80"
+            }}
+          />
         </View>
       </SafeAreaView>
     </>