Update deps and introduce new article

pages/articles/index.vue

@@ -16,7 +16,10 @@ definePageMeta({
   >
     <ContentList :query="{ sort: [{ date: -1 }] }" v-slot="{ list }">
       <div v-for="article in list" :key="article._path">
-        <ArticleListing :article="article" />
+        <ArticleListing
+          :article="article"
+          v-if="article._path?.startsWith('/articles')"
+        />
       </div>
     </ContentList>
   </UContainer>

pages/services/[...slug].vue

@@ -0,0 +1,54 @@
+<script setup lang="ts">
+import { formatDate } from "@vueuse/core";
+
+definePageMeta({
+    layout: "content",
+});
+
+const { path } = useRoute();
+</script>
+
+<template>
+    <ContentDoc>
+        <template v-slot="{ doc }">
+            <UContainer
+                v-motion-fade
+                class="flex flex-col gap-3 prose dark:prose-invert"
+                as="article"
+            >
+                <h1>{{ doc.title }}</h1>
+            </UContainer>
+
+            <UContainer
+                class="hidden md:block"
+                as="figure"
+                v-if="doc.coverImage"
+                v-motion-fade
+                :delay="500"
+            >
+                <NuxtImg
+                    placeholder
+                    :src="doc.coverImage"
+                    :alt="doc.title"
+                    height="1000"
+                    width="1700"
+                    class="rounded-lg"
+                />
+            </UContainer>
+            <UContainer
+                v-motion-fade
+                :delay="500"
+                class="flex flex-col gap-3 prose dark:prose-invert !pt-0"
+                as="article"
+            >
+                <ContentRenderer :value="doc" />
+            </UContainer>
+        </template>
+
+        <template #empty>
+            <h1>Document is empty</h1>
+        </template>
+    </ContentDoc>
+
+    <Footer v-motion-fade :delay="500" />
+</template>