61 lines
1.3 KiB
TypeScript
61 lines
1.3 KiB
TypeScript
|
|
import {
|
|
View,
|
|
Dimensions,
|
|
StyleSheet,
|
|
ViewStyle,
|
|
} from 'react-native';
|
|
|
|
import React from 'react';
|
|
|
|
import { MaterialCommunityIcons } from '@expo/vector-icons';
|
|
import { Text, Button } from "@ui-kitten/components";
|
|
import { appTheme } from "../theme";
|
|
import { Property } from '../types/property';
|
|
|
|
import ImageCarousel from './ImageCarousel';
|
|
import Row from './Row';
|
|
import CardInformation from './CardInformation';
|
|
|
|
const LISTMARGIN = 10;
|
|
const WIDTH = Dimensions.get("screen").width - LISTMARGIN * 2;
|
|
|
|
|
|
//each property listing is shown as a card, using this component
|
|
const Card = ({ property, style,}:{property: Property; style?: ViewStyle;}) => {
|
|
return (
|
|
<View style={{ marginVertical: 5 }}>
|
|
|
|
<ImageCarousel images={property.images}/>
|
|
|
|
{/* Everything under the image is wrapped in this view */}
|
|
<CardInformation property={property}/>
|
|
|
|
</View>
|
|
)
|
|
}
|
|
|
|
export default Card
|
|
|
|
const styles = StyleSheet.create({
|
|
|
|
button: {
|
|
width: "49%",
|
|
},
|
|
defaultMarginTop: {
|
|
marginTop: 5
|
|
},
|
|
rowJustification: {
|
|
justifyContent: "space-between"
|
|
},
|
|
informationContainer: {
|
|
paddingVertical: 10,
|
|
paddingHorizontal: 5,
|
|
borderColor: "#d3d3d3",
|
|
borderBottomLeftRadius: 5,
|
|
borderBottomRightRadius: 5,
|
|
borderWidth: 1,
|
|
}
|
|
|
|
|
|
}) |