File tree Expand file tree Collapse file tree 1 file changed +65
-0
lines changed Expand file tree Collapse file tree 1 file changed +65
-0
lines changed Original file line number Diff line number Diff line change
1
+ <template >
2
+ <div class =" events" >
3
+ <h1 >Events For Good</h1 >
4
+ <EventCard v-for =" event in events" :key =" event.id" :event =" event" />
5
+ </div >
6
+ </template >
7
+
8
+ <script >
9
+ // @ is an alias to /src
10
+ import EventCard from ' @/components/EventCard.vue'
11
+
12
+ export default {
13
+ name: ' EventList' ,
14
+ components: {
15
+ EventCard
16
+ },
17
+ data () {
18
+ return {
19
+ events: [
20
+ {
21
+ id: 5928101 ,
22
+ category: ' animal welfare' ,
23
+ title: ' Cat Adoption Day' ,
24
+ description: ' Find your new feline friend at this event.' ,
25
+ location: ' Meow Town' ,
26
+ date: ' January 28, 2022' ,
27
+ time: ' 12:00' ,
28
+ petsAllowed: true ,
29
+ organizer: ' Kat Laydee'
30
+ },
31
+ {
32
+ id: 4582797 ,
33
+ category: ' food' ,
34
+ title: ' Community Gardening' ,
35
+ description: ' Join us as we tend to the community edible plants.' ,
36
+ location: ' Flora City' ,
37
+ date: ' March 14, 2022' ,
38
+ time: ' 10:00' ,
39
+ petsAllowed: true ,
40
+ organizer: ' Fern Pollin'
41
+ },
42
+ {
43
+ id: 8419988 ,
44
+ category: ' sustainability' ,
45
+ title: ' Beach Cleanup' ,
46
+ description: ' Help pick up trash along the shore.' ,
47
+ location: ' Playa Del Carmen' ,
48
+ date: ' July 22, 2022' ,
49
+ time: ' 11:00' ,
50
+ petsAllowed: false ,
51
+ organizer: ' Carey Wales'
52
+ }
53
+ ]
54
+ }
55
+ }
56
+ }
57
+ </script >
58
+
59
+ <style scoped>
60
+ .events {
61
+ display : flex ;
62
+ flex-direction : column ;
63
+ align-items : center ;
64
+ }
65
+ </style >
You can’t perform that action at this time.
0 commit comments