Pinterest Cards

List Pinterest style cards with ease in your Mobile app.

Usage

import {PinterestCards} from "react-native-lights";
import {View} from "react-native";
const PinterestCards = () => {
const listData = [
{
title: 'Beautiful and dramatic Antelope',
description: 'Lorem ipsum dolor sit amet et nuncat mergitur',
image: 'https://i.imgur.com/UYiroysl.jpg',
},
{
title: 'Earlier this morning, NYC',
description: 'Lorem ipsum dolor sit amet',
image: 'https://i.imgur.com/UPrs1EWl.jpg',
},
{
title: 'White Pocket Sunset',
description: 'Lorem ipsum dolor sit amet et nuncat ',
image: 'https://i.imgur.com/MABUbpDl.jpg',
},
{
title: 'Acrocorinth, Greece',
description: 'Lorem ipsum dolor sit amet et nuncat mergitur',
image: 'https://i.imgur.com/KZsmUi2l.jpg',
},
]
return (
<View>
<PinterestCards data={listData} />
</View>
)
}

Props

NameimageTypeURLdefault-descriptionRenders the image inside the card
NameimageHeightTypeintdefault200descriptionImage inside the card
NamecardBackgroundColorTypestringdefault#121111descriptionBackbround color for the card
NameborderRadiusTypeintdefault5descriptionBorder Radius for the image inside the card
NameprimaryTextSizeTypeintdefault14descriptionTitle text Size
NameprimaryTextAlignTypeintdefault14description left
NameprimaryTextColorTypestringdefaultblackdescription Title text Color
NameprimaryFontFamilyTypestringdefaultArialdescription Title font family
NameprimaryFontWeightTypestringdefaultbolddescriptionFont weight of the title text
NamesecondaryTextSizeTypeintdefault14descriptionTitle text Size
NamecardBodyHeightTypeintdefault150descriptionHeight of the body section of the card
NamesecondaryTextColorTypestringdefaultblackdescription Title text Color
NamesecondaryFontFamilyTypestringdefaultArialdescription Title font family
NamesecondaryFontWeightTypestringdefaultnormaldescription Title font weight
NamebuttonFunctionTypefunctiondefault-descriptionFunction for the respective card button