Merge pull request #18 from Brian-E-Nguyen/photos

Photos View

src/components/PhotoGallery.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="gallery_section">
+    <h2 class="event_namedate_header">{{ event.name }}, {{ event.date }}</h2>
+    <v-row>
+      <v-col v-for="photo in event.photos" :key="photo" cols="6" lg="4">
+        <PhotoCard :photo="photo" />
+      </v-col>
+    </v-row>
+  </div>
+</template>
+
+<script>
+import PhotoCard from './PhotoCard.vue';
+export default {
+  components: {
+    PhotoCard,
+  },
+  props: {
+    event: Object,
+  },
+};
+</script>
+
+<style>
+.event_namedate_header {
+  color: #34be82;
+}
+.gallery_section {
+  margin: 3rem 0px;
+}
+</style>

src/views/PhotosView.vue

@@ -1,3 +1,57 @@
 <template>
-  <h1>Photos</h1>
+  <v-container>
+    <h1 id="photos_header">Photos</h1>
+    <h3 id="photos_subheader">
+      Get a glimpse at what we do in our organization!
+    </h3>
+    <div v-for="(event, i) in events" :key="i">
+      <PhotoGallery :event="event" />
+    </div>
+  </v-container>
 </template>
+
+<script>
+import PhotoGallery from '../components/PhotoGallery.vue';
+export default {
+  components: {
+    PhotoGallery,
+  },
+  data: () => ({
+    events: [
+      {
+        name: 'Medical Outreach',
+        date: '11/13/21',
+        photos: [
+          'https://res.cloudinary.com/buraiyen/image/upload/v1637183817/CSULB_TC_Website/6F3E6219-7561-4D01-AA4A-B13A735CCE80_kjncp4.jpg',
+          'https://res.cloudinary.com/buraiyen/image/upload/v1637183822/CSULB_TC_Website/IMG_9996_bdgkjf.jpg',
+          'https://res.cloudinary.com/buraiyen/image/upload/v1637183820/CSULB_TC_Website/IMG_0040_txeaj1.jpg',
+        ],
+      },
+      {
+        name: 'Fall Week of Welcome',
+        date: '9/5/21',
+        photos: [
+          'https://res.cloudinary.com/buraiyen/image/upload/c_scale,w_1151/v1637269283/CSULB_TC_Website/Gallery/2021_WeekOfWelcome/BEN_1548_pynqen.jpg',
+          'https://res.cloudinary.com/buraiyen/image/upload/c_scale,w_1084/v1637269278/CSULB_TC_Website/Gallery/2021_WeekOfWelcome/BEN_1632_sdahq2.jpg',
+          'https://res.cloudinary.com/buraiyen/image/upload/c_scale,w_1148/v1637269268/CSULB_TC_Website/Gallery/2021_WeekOfWelcome/BEN_1689_fjaew9.jpg',
+          'https://res.cloudinary.com/buraiyen/image/upload/c_scale,w_892/v1637269276/CSULB_TC_Website/Gallery/2021_WeekOfWelcome/BEN_1533_uplruz.jpg',
+          'https://res.cloudinary.com/buraiyen/image/upload/c_scale,w_1020/v1637269282/CSULB_TC_Website/Gallery/2021_WeekOfWelcome/BEN_1661_klychz.jpg',
+        ],
+      },
+    ],
+  }),
+};
+</script>
+
+<style>
+#photos_header {
+  text-align: center;
+  font-size: 3rem;
+  color: #2f86a6;
+}
+#photos_subheader {
+  text-align: center;
+  font-size: 2rem;
+  color: #3babd4;
+}
+</style>