first push

src/components/Sections/EventList.vue

@@ -0,0 +1,49 @@
+<script setup>
+  import { ref, onMounted, computed } from "vue";
+
+  import { useMenuStore } from '../../stores/MenuStore';
+  const MenuStore = useMenuStore();
+  MenuStore.get_today();
+
+
+  import EventListingComplete from '../listings/EventListing.vue';
+  import Promo from '../listings/BlueskyLinks.vue';
+  // import Promo from '../listings/Promo.vue';
+
+  import { useEventsStore } from '../../stores/EventsStore';
+
+  const props = defineProps({
+        limit: {
+            type: Number,
+            require: false
+        },
+        
+        cal: {
+          type: String,
+          require: true
+        }
+    })
+
+  const store = useEventsStore();
+  store.fetchEvents(props.cal);
+  store.fetchPromo();
+  const events = computed(() => {
+    return store.events;
+  });
+  const promo = computed(() => {
+    return store.promo;
+  });
+
+  
+
+</script>
+        
+<template>
+  <div class="md:flex md:flex-wrap lg:flex lg:flex-wrap md:flex md:justify-center lg:flex lg:justify-center z-0">
+    <span class="self-stretch" v-for="(item, index) in events">
+      <Promo  v-if="(index % 6 == 0) && index != 0 && events.length > 12" :item = promo[(index/6)-1] :index = "(index/6)-1"/>
+      <EventListingComplete v-else-if="(index % 6 != 0)" :item = "item" :index = "index" />
+      <!-- <EventListingComplete :item = "item" :index = "index" /> -->
+    </span>
+  </div>
+</template>