35 lines
726 B
Vue
35 lines
726 B
Vue
<script setup lang="ts">
|
|
import { computed } from "vue";
|
|
import { data as posts } from "../composables/posts.data";
|
|
import BlogItem from "../layout/BlogItem.vue";
|
|
|
|
const sortedPosts = computed(() => {
|
|
return [...posts].sort((a, b) => b.date.time - a.date.time);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="blog-index">
|
|
<h1>All Posts</h1>
|
|
<ul class="blog-list">
|
|
<li v-for="post in sortedPosts" :key="post.url">
|
|
<BlogItem
|
|
:url="post.url"
|
|
:title="post.title"
|
|
:date="post.date.string"
|
|
:excerpt="post.excerpt"
|
|
/>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.blog-index {
|
|
}
|
|
.blog-list {
|
|
list-style: none;
|
|
padding: 0;
|
|
margin: 1em 0;
|
|
}
|
|
</style>
|