Merge branch 'main' into feat/build-integrity

Author: farnabaz

docs/app.config.ts

@@ -1,11 +1,15 @@
 export default defineAppConfig({
+  github: {
+    owner: 'nuxt',
+    repo: 'content',
+    branch: 'main'
+  },
   docus: {
     title: 'Nuxt Content',
     description: 'Write pages in markdown, use Vue components and enjoy the power of Nuxt with a blazing fast developer experience.',
     layout: 'docs',
     image: 'https://content.nuxtjs.org/preview.png',
     url: 'https://content.nuxtjs.org',
-    debug: false,
     socials: {
       twitter: '@nuxt_js',
       github: 'nuxt/content'
@@ -23,26 +27,20 @@ export default defineAppConfig({
       level: 1
     },
     header: {
-      title: false,
-      logo: true,
+      logo: 'Logo',
       exclude: ['/v1', '/content-v1', '/fr', '/ja', '/ru']
     },
     footer: {
-      credits: {
-        icon: 'IconDocus',
-        text: 'Powered by Docus',
-        href: 'https://docus.com'
-      },
-      icons: [
+      iconLinks: [
         {
           label: 'NuxtJS',
           href: 'https://nuxtjs.org',
-          component: 'IconNuxt'
+          icon: 'IconNuxt'
         },
         {
           label: 'Vue Telescope',
           href: 'https://vuetelescope.com',
-          component: 'IconVueTelescope'
+          icon: 'IconVueTelescope'
         }
       ]
     }

docs/components/content/ChangeLog.vue

@@ -0,0 +1,64 @@
+<template>
+  <div>
+    <GithubReleases v-slot="{releases}">
+      <div v-for="release in releases" :key="release.name" class="release">
+        <div class="release-name">
+          <h2 class="">
+            {{ release.name }}
+          </h2>
+        </div>
+        <div class="content">
+          <h3 class="sr-only">
+            Description
+          </h3>
+
+          <ContentRenderer :value="release">
+            <template #empty>
+              <p>
+                No description provided
+              </p>
+            </template>
+          </ContentRenderer>
+        </div>
+      </div>
+    </GithubReleases>
+  </div>
+</template>
+
+<style scoped lang="ts">
+css({
+  '.release': {
+    position: 'relative',
+    display: 'flex',
+    overflow: 'hidden',
+    flex: '1',
+    padding: '{space.4} {space.8}',
+    paddingBottom: '{space.8}',
+    overflowY: 'auto',
+  },
+  '.release-name': {
+    position: 'relative',
+    paddingTop: '{space.4}',
+    display: 'flex',
+    alignItems: 'flex-start',
+    justifyContent: 'space-between',
+    gap: '{space.4}',
+    paddingBottom: '{space.4}',
+
+    'h2': {
+      fontSize: '{fontSizes.2xl}',
+      fontWeight: '{fontWeights.bold}',
+      color: '{colors.gray.900}',
+      marginTop: '{space.8}',
+      '@dark': {
+        color: '{colors.gray.100}'
+      }
+    }
+  },
+  '.content': {
+    paddingLeft: '{space.8}',
+    paddingRight: '{space.8}',
+    paddingBottom: '{space.24}',
+  }
+})
+</style>

docs/components/content/Ellipsis.vue

@@ -12,8 +12,49 @@ defineProps({
 </script>
 
 <template>
-  <NuxtLink :to="to" class="hover:bg-primary-200 text-primary-900 bg-primary-100 transition dark:bg-transparent hover:dark:bg-primary-900 dark:border-primary-700 dark:text-primary-100 border border-primary-400 mb-8 px-4 py-2 rounded-md flex gap-x-1 inline-flex items-center justify-center">
-    <Icon name="heroicons-solid:sparkles" class="h-4 w-4" />
-    <span class="font-medium text-sm">{{ label }}</span>
+  <NuxtLink :to="to" class="link">
+    <Icon name="heroicons-solid:sparkles" class="icon" />
+    <span>{{ label }}</span>
   </NuxtLink>
 </template>
+
+<style scoped lang="ts">
+css({
+  '.link': {
+    color: '{colors.primary.900}',
+    backgroundColor: '{colors.primary.100}',
+    borderColor: '{colors.primary.400}',
+    borderRadius: '{radii.md}',
+    borderWidth: '{borderWidths.sm}',
+    borderStyle: 'solid',
+    display: 'inline-flex',
+    padding: '{space.2} {space.4}',
+    marginBottom: '{space.4}',
+    alignItems: 'center',
+    justifyContent: 'center',
+    gap: '{space.1}',
+
+    '@dark': {
+      color: '{colors.primary.100}',
+      backgroundColor: 'transparent',
+      borderColor: '{colors.primary.700}'
+    },
+
+    '&:hover': {
+      backgroundColor: '{colors.primary.200}',
+      '@dark': {
+        backgroundColor: '{colors.primary.900}'
+      },
+    }
+  },
+  '.link span': {
+    // font-medium text-sm
+    fontWeight: '{fontWeights.medium}',
+    fontSize: '{fontSizes.sm}'
+  },
+  '.link .icon': {
+    width: '{space.4}',
+    height: '{space.4}'
+  }
+})
+</style>