Skip to content

Commit 884b467

Browse files
OskarLebudaOskarLebuda
committed
feat: add deploy and move docs to vercube repo
1 parent c4e93af commit 884b467

64 files changed

Lines changed: 556 additions & 11598 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.github/workflows/deploy.yml‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
name: Deploy Documentation
2+
3+
on:
4+
push:
5+
branches: [ main ]
6+
paths:
7+
- 'docs/**'
8+
- '.github/workflows/docs.yml'
9+
workflow_dispatch:
10+
11+
permissions:
12+
contents: read
13+
pages: write
14+
id-token: write
15+
16+
jobs:
17+
build:
18+
runs-on: ubuntu-latest
19+
steps:
20+
- uses: actions/checkout@v4
21+
22+
- name: Setup Node.js
23+
uses: actions/setup-node@v4
24+
with:
25+
node-version: '22'
26+
27+
- name: Setup pnpm
28+
uses: pnpm/action-setup@v3
29+
with:
30+
version: '9.15.0'
31+
32+
- name: Install dependencies
33+
run: pnpm install
34+
35+
- name: Build documentation
36+
run: pnpm docs:build
37+
38+
- name: Upload artifact
39+
uses: actions/upload-pages-artifact@v3
40+
with:
41+
path: docs/.vitepress/dist
42+
43+
deploy:
44+
environment:
45+
name: github-pages
46+
url: ${{ steps.deployment.outputs.page_url }}
47+
runs-on: ubuntu-latest
48+
needs: build
49+
steps:
50+
- name: Deploy to GitHub Pages
51+
id: deployment
52+
uses: actions/deploy-pages@v4

‎app/app.config.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ export default defineAppConfig({
5555
links,
5656
nav: [
5757
{ label: 'Docs', to: '/docs' },
58-
{ label: 'Examples', to: '/examples' },
58+
{ label: 'Examples', to: '/docs/getting-started/examples' },
5959
{ label: 'Changelog', to: '/changelog' },
6060
{ label: 'Blog', to: '/blog' }
6161
]

‎app/components/Blog/Header.vue‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
<script setup lang="ts">
2+
const { title, description } = defineProps<{
3+
title: string
4+
description: string
5+
}>()
6+
</script>
7+
8+
<template>
9+
<UPageSection
10+
:title="title"
11+
:description="description"
12+
class="relative"
13+
orientation="vertical"
14+
:ui="{
15+
root: 'border-b border-default overflow-hidden',
16+
container: 'z-[10] xl:mt-20',
17+
wrapper: 'relative flex flex-col',
18+
headline: 'mb-6',
19+
title: 'text-left text-4xl font-(family-name:--font-geist-mono)',
20+
description: 'text-left max-w-lg font-(family-name:--font-geist-mono)',
21+
links: 'gap-1 justify-start -ms-2.5'
22+
}"
23+
>
24+
<template #top>
25+
<div class="absolute inset-0 z-[-1] overflow-hidden">
26+
<HomeBackground class="inset-0" />
27+
<div class="absolute inset-0 bg-gradient-to-r from-black via-black/80 to-transparent pointer-events-none" />
28+
</div>
29+
</template>
30+
</UPageSection>
31+
</template>

‎app/components/Blog/Post.vue‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
<script setup lang="ts">
2+
import type { Collections } from '@nuxt/content'
3+
4+
const { post } = defineProps<{
5+
post: Collections['blog']
6+
to: string
7+
}>()
8+
9+
const formatDate = (dateString: string) => {
10+
return new Date(dateString).toLocaleDateString('en-US', {
11+
year: 'numeric',
12+
month: 'short',
13+
day: 'numeric'
14+
})
15+
}
16+
</script>
17+
18+
<template>
19+
<article class="p-4 cursor-pointer rounded-lg relative hover:bg-muted/10 transition-colors duration-200">
20+
<NuxtLink
21+
:to
22+
class="absolute inset-0"
23+
/>
24+
<div class="flex md:flex-row flex-col gap-4 sm:gap-6">
25+
<NuxtImg
26+
:src="post.shortImage"
27+
:alt="post.title"
28+
loading="lazy"
29+
format="webp"
30+
class="md:max-w-1/3 aspect-video object-cover rounded-lg"
31+
/>
32+
<div class="flex flex-col justify-around gap-1">
33+
<div class="flex flex-col gap-1">
34+
<span class="text-xs font-medium text-muted">
35+
{{ formatDate(post.date) }}
36+
</span>
37+
<h2 class="text-xl font-bold text-primary">
38+
{{ post.title }}
39+
</h2>
40+
<p class="text-muted">
41+
{{ post.description }}
42+
</p>
43+
</div>
44+
<div class="flex items-center gap-2 mt-2">
45+
<UUser
46+
v-for="(author, index) in post.authors"
47+
:key="index"
48+
color="neutral"
49+
variant="outline"
50+
v-bind="author"
51+
/>
52+
</div>
53+
</div>
54+
</div>
55+
</article>
56+
</template>

‎app/components/OgImage/Docs.vue‎

Lines changed: 54 additions & 0 deletions
Large diffs are not rendered by default.

‎app/components/OgImage/OgImageDocs.vue‎

Lines changed: 0 additions & 76 deletions
This file was deleted.

‎app/layouts/blog.vue‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<template>
2+
<div class="relative min-h-screen">
3+
<HomeNav />
4+
<slot />
5+
</div>
6+
</template>

‎app/layouts/changelog.vue‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,8 +40,6 @@
4040
</UPageSection>
4141

4242
<section class="px-4 sm:px-6 xl:px-0 xl:-ms-30 xl:flex-1">
43-
<UColorModeButton class="fixed top-4 right-4 z-10" />
44-
4543
<slot />
4644
</section>
4745
</div>

‎app/pages/blog/[...slug].vue‎

Lines changed: 139 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,139 @@
1+
<script setup lang="ts">
2+
import { kebabCase } from 'scule'
3+
4+
definePageMeta({
5+
layout: 'blog'
6+
})
7+
8+
const route = useRoute()
9+
10+
const { data: page } = await useAsyncData(kebabCase(route.path), () => queryCollection('blog').path(route.path).first())
11+
if (!page.value) {
12+
throw createError({ statusCode: 404, statusMessage: 'Page not found', fatal: true })
13+
}
14+
15+
// if (page.value.image) {
16+
// defineOgImage({ url: page.value.image })
17+
// } else {
18+
// defineOgImageComponent('Docs', {
19+
// headline: breadcrumb.value.map(item => item.label).join(' > ')
20+
// }, {
21+
// fonts: ['Geist:400', 'Geist:600']
22+
// })
23+
// }
24+
25+
const title = page.value.seo?.title || page.value.title
26+
const description = page.value.seo?.description || page.value.description
27+
const titleTemplate = ref('%s - Vercube Blog')
28+
29+
useSeoMeta({
30+
title,
31+
titleTemplate,
32+
description,
33+
ogDescription: description,
34+
ogTitle: titleTemplate.value?.includes('%s') ? titleTemplate.value.replace('%s', title) : title
35+
})
36+
37+
const editThisPage = computed(() => ({
38+
icon: 'i-heroicons-pencil-square-solid',
39+
label: 'Edit this page',
40+
to: `https://github.com/hugorcd/shelve/edit/main/apps/lp/content/${page?.value?.stem}.md`,
41+
target: '_blank'
42+
}))
43+
const articleLink = computed(() => `${window.location}${page.value?.path}`)
44+
45+
const formatDate = (dateString: string) => {
46+
return new Date(dateString).toLocaleDateString('en-US', {
47+
year: 'numeric',
48+
month: 'short',
49+
day: 'numeric'
50+
})
51+
}
52+
</script>
53+
54+
<template>
55+
<UPage v-if="page">
56+
<div class="absolute inset-0 z-[-1] overflow-hidden">
57+
<HomeBackground class="inset-0" />
58+
<div class="absolute inset-0 bg-gradient-to-r from-black via-black/80 to-transparent pointer-events-none" />
59+
</div>
60+
<UContainer class="flex flex-col items-center gap-3 mt-8 xl:pt-30">
61+
<UPageSection
62+
:title="title"
63+
:description="description"
64+
class="relative"
65+
orientation="vertical"
66+
:ui="{
67+
root: 'overflow-hidden pb-2',
68+
container: 'z-[10] !p-4 !gap-8',
69+
wrapper: 'relative flex flex-col',
70+
title: 'text-left text-4xl font-(family-name:--font-geist-mono)',
71+
description: 'text-left font-(family-name:--font-geist-mono)',
72+
links: 'gap-1 justify-start -ms-2.5'
73+
}"
74+
>
75+
<template #title>
76+
<h1 class="sm:text-4xl lg:text-5xl text-pretty tracking-tight text-highlighted text-left text-4xl font-(family-name:--font-geist-mono)">
77+
{{ page.title }}
78+
</h1>
79+
</template>
80+
81+
<template #top>
82+
<NuxtImg
83+
v-if="page.image"
84+
:src="page.image"
85+
:alt="page.title"
86+
class="rounded-lg w-full h-[250px] object-cover object-center mb-4"
87+
/>
88+
89+
<div class="flex text-xs text-muted gap-2 w-full max-w-(--ui-container) mx-auto p-4">
90+
<span>
91+
{{ formatDate(page.date) }}
92+
</span>
93+
-
94+
<span>
95+
{{ page.minRead }} MIN READ
96+
</span>
97+
</div>
98+
</template>
99+
100+
<template #default>
101+
<UUser
102+
v-if="page.author"
103+
variant="outline"
104+
v-bind="page.author"
105+
/>
106+
</template>
107+
</UPageSection>
108+
</UContainer>
109+
<div class="bg-black border-t border-default">
110+
<UPageBody class="max-w-3xl mx-auto !mt-0 pt-5">
111+
<ContentRenderer
112+
v-if="page.body"
113+
:value="page"
114+
/>
115+
116+
<AppDivider class="my-10">
117+
<div class="flex items-center gap-2 text-sm text-muted">
118+
<UButton
119+
size="sm"
120+
variant="link"
121+
color="neutral"
122+
label="Copy link"
123+
@click="copyToClipboard(articleLink, 'Article link copied to clipboard')"
124+
/>
125+
-
126+
<UButton
127+
size="sm"
128+
variant="link"
129+
color="neutral"
130+
:to="editThisPage.to"
131+
target="_blank"
132+
label="Edit this page on GitHub"
133+
/>
134+
</div>
135+
</AppDivider>
136+
</UPageBody>
137+
</div>
138+
</UPage>
139+
</template>

0 commit comments

Comments
 (0)