Scaffold SSR site with CMS/blog/gallery/SEO admin and deploy configs for montech.ir. Co-authored-by: Cursor <cursoragent@cursor.com>
30 lines
1.4 KiB
Vue
30 lines
1.4 KiB
Vue
<template>
|
|
<div class="min-h-screen px-6 pb-24 pt-28 md:px-10">
|
|
<SiteNavbar :brand="'Montech'" />
|
|
<div class="mx-auto max-w-[1100px]">
|
|
<h1 class="font-display text-5xl font-extrabold uppercase tracking-[-0.03em] md:text-7xl">Blog</h1>
|
|
<p class="mt-4 max-w-xl text-ash">Notes on product, engineering and shipping software.</p>
|
|
<ul class="mt-16 divide-y divide-white/[0.07] border-y border-white/[0.07]">
|
|
<li v-for="post in posts" :key="post.id" class="py-8">
|
|
<NuxtLink :to="`/blog/${post.slug}`" class="group block">
|
|
<p class="font-mono text-[10px] tracking-[0.22em] text-ash">
|
|
{{ post.publishedAt ? new Date(post.publishedAt).toLocaleDateString("en-GB") : "" }}
|
|
</p>
|
|
<h2 class="mt-2 font-display text-2xl font-bold uppercase tracking-[-0.02em] group-hover:text-volt md:text-3xl">
|
|
{{ post.title }}
|
|
</h2>
|
|
<p class="mt-3 max-w-2xl text-sm text-ash">{{ post.excerpt }}</p>
|
|
</NuxtLink>
|
|
</li>
|
|
</ul>
|
|
<p v-if="!posts?.length" class="mt-10 text-ash">No posts yet.</p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const { data: posts } = await useAsyncData("blog-list", () => fetchPublicBlog());
|
|
const { data: page } = await useAsyncData("page-blog", () => fetchPage("blog"));
|
|
applyPageSeo(page.value?.seo);
|
|
</script>
|