<script setup lang="ts">
import _events from '~/assets/jsons/events.json'
import type { Event } from '~/common/interfaces/Event'

const events = _events as Event[]
</script>

<template>
  <h1>事件</h1>

  <v-timeline side="end">
    <v-timeline-item
      v-for="event, i in events"
      :key="i"
      size="small"
    >
      <section>
        <h2 class="mt--4px font-light mb-0" v-text="event.name" />
        <time
          class="pt-1 c-coolgray-400 not-prose"
          v-text="event.time"
        />
        <p class="mt-2px">
          {{ event.description }}
        </p>
      </section>
    </v-timeline-item>
  </v-timeline>
</template>
