diff --git a/components/EventCard.js b/components/EventCard.js new file mode 100644 index 0000000..b342f49 --- /dev/null +++ b/components/EventCard.js @@ -0,0 +1,37 @@ +import { StyleSheet, Text, TouchableOpacity, View } from "react-native"; +import Colors from "../constants/colors"; + +const EventCard = (props) => { + return ( + + + + {props.event._name} ({props.event._date}) + + + + ); +}; + +const styles = StyleSheet.create({ + screen: { + flex: 1, + alignItem: "center", + justifyContent: "center", + backgroundColor: Colors.primary500, + }, + eventItem: { + margin: 10, + padding: 10, + borderRadius: 10, + borderWidth: 1, + borderColor: "white", + height: 60, + backgroundColor: Colors.primary400, + }, + text: { + color: "white", + }, +}); + +export default EventCard; diff --git a/screens/EventOverviewScreen.js b/screens/EventOverviewScreen.js new file mode 100644 index 0000000..d96554c --- /dev/null +++ b/screens/EventOverviewScreen.js @@ -0,0 +1,33 @@ +import { ScrollView, StyleSheet, View } from "react-native"; +import { StatusBar } from "expo-status-bar"; + +import { EVENTS } from "../data/EventData"; + +import Colors from "../constants/colors"; +import EventCard from "../components/EventCard"; +import FloatingButton from "../components/FloatingButton"; + +const eventsToDisplay = EVENTS.map((event, index) => { + return ; +}); + +const EventOverviewScreen = (props) => { + return ( + + {eventsToDisplay} + + + + ); +}; + +const styles = StyleSheet.create({ + container: { + flex: 1, + backgroundColor: Colors.primary500, + alignItem: "center", + justifyContent: "center", + }, +}); + +export default EventOverviewScreen;