From e597bdad382c08361b1399b5d82903f595837f91 Mon Sep 17 00:00:00 2001 From: Khoi <110973167+marked01one@users.noreply.github.com> Date: Mon, 14 Nov 2022 12:13:35 -0800 Subject: [PATCH 01/32] Created a sample EventCard component --- packages/app/components/EventCard.js | 94 ++++++++++++++ .../eventcard_test/faces_test/cplusplus.png | Bin 0 -> 23890 bytes .../eventcard_test/faces_test/csharp.png | Bin 0 -> 25711 bytes .../eventcard_test/faces_test/javascript.png | Bin 0 -> 11139 bytes .../eventcard_test/faces_test/python.png | Bin 0 -> 26565 bytes .../eventcard_test/test_card_banner.png | Bin 0 -> 216593 bytes packages/app/package.json | 3 + packages/app/screens/landing/LandingScreen.js | 7 ++ packages/app/utils/constants.js | 2 +- scripts/run.js | 2 +- yarn.lock | 117 +++++++++++++++++- 11 files changed, 219 insertions(+), 6 deletions(-) create mode 100644 packages/app/components/EventCard.js create mode 100644 packages/app/components/eventcard_test/faces_test/cplusplus.png create mode 100644 packages/app/components/eventcard_test/faces_test/csharp.png create mode 100644 packages/app/components/eventcard_test/faces_test/javascript.png create mode 100644 packages/app/components/eventcard_test/faces_test/python.png create mode 100644 packages/app/components/eventcard_test/test_card_banner.png diff --git a/packages/app/components/EventCard.js b/packages/app/components/EventCard.js new file mode 100644 index 00000000..b207282c --- /dev/null +++ b/packages/app/components/EventCard.js @@ -0,0 +1,94 @@ +import React, { useCallback, useEffect, useState} from 'react'; +import Button from '@app/components/Button'; +import { View, Image, Text, FlatList, StyleSheet } from 'react-native'; +import { Card, ListItem, Icon, Divider } from 'react-native-elements'; +import FacePile from 'react-native-face-pile'; + +const FACES = [ + { + id: 0, + imageUrl: "./eventcard_test/faces_test/python.png" + }, + { + id: 1, + imageUrl: "./eventcard_test/faces_test/cplusplus.png" + }, + { + id: 2, + imageUrl: "./eventcard_test/faces_test/csharp.png" + }, + { + id: 3, + imageUrl: "./eventcard_test/faces_test/javascript.png" + } +]; + +function EventCard(props){ + const styles = StyleSheet.create({ + banner: { + width: 360, + height: 144, + borderTopLeftRadius: 10, + borderTopRightRadius: 10 + }, + button: { + borderRadius: 10, + elevation: 0, + marginBottom: 0, + marginLeft: 0, + marginRight: 0 + }, + card: { + borderRadius: 10, + borderColor: 'white', + elevation: 0, + padding: 0 + }, + description: { + marginBottom: 10, + fontSize: 12 + }, + eventTitle: { + fontSize: 20, + fontWeight: 'bold' + }, + smallText: { + fontSize: 9, + color: 'grey' + } + }); + + const registerGoing = () => { + console.log("Hello world"); + }; + + const [faces] = FACES; + + return ( + + + + {props.timeBegin} - {props.timeEnd} + {props.eventTitle} + 📌 {props.location} + {props.description} + + +