chore(app): initial commit by Nuxt Studio

.gitignore

@@ -0,0 +1,16 @@
+node_modules
+*.log*
+.nuxt
+.nitro
+.cache
+.output
+.env
+dist
+.DS_Store
+
+# Yarn
+.yarn/cache
+.yarn/*state*
+
+# Local History
+.history

.npmrc

@@ -0,0 +1,2 @@
+shamefully-hoist=true
+strict-peer-dependencies=false

README.md

@@ -0,0 +1,21 @@
+# My Website
+
+My website made by [Content Wind](https://content-wind.nuxt.space) theme.
+
+## Setup
+
+```bash
+npm install
+```
+
+## Development
+
+```bash
+npm run dev
+```
+
+Then open [http://localhost:3000](http://localhost:3000) to see your app.
+
+## Deployment
+
+Learn more how to deploy on [Nuxt docs](https://nuxt.com/docs/getting-started/deployment).

app.config.ts

@@ -0,0 +1,9 @@
+export default defineAppConfig({
+  // Configure Content Wind here
+  cover: '/cover.jpg',
+  socials: {
+    twitter: 'Atinux',
+    github: 'Atinux/content-wind',
+    mastodon: '@[email protected]'
+  }
+})

components/content/ButtonLink.vue

@@ -0,0 +1,25 @@
+<script setup>
+defineProps({
+  href: {
+    type: String,
+    required: true,
+  },
+  external: {
+    type: Boolean,
+    default: false,
+  },
+  icon: {
+    type: String,
+    default: '',
+  },
+})
+</script>
+
+<template>
+  <span class="not-prose">
+    <NuxtLink :to="href" :external="external" class="inline-flex items-center gap-1 text-white bg-gray-800 dark:bg-gray-200 dark:text-gray-950 px-3 py-1 rounded no-underline">
+      <Icon v-if="icon" :name="icon" class="w-4 h-4" />
+      <ContentSlot :use="$slots.default" unwrap="p" />
+    </NuxtLink>
+  </span>
+</template>

components/content/MarkdownBlock.vue

@@ -0,0 +1,4 @@
+<!-- This component is used to show Markdown code block examples -->
+<template>
+  <pre class="max-w-full overflow-x-auto text-gray-700 dark:text-gray-300"><ContentSlot :use="$slots.default" unwrap="p" /></pre>
+</template>

content/1.index.md

@@ -0,0 +1,210 @@
+---
+navigation:
+  title: Home
+---
+
+# Content Wind
+
+A lightweight Nuxt theme to build a Markdown driven website, based on [Nuxt Content](https://content.nuxt.com), [TailwindCSS](https://tailwindcss.com) and [Iconify](https://iconify.design) ✨
+
+## Features
+
+- Write pages in Markdown
+- Use [layouts](https://nuxt.com/docs/guide/directory-structure/layouts) in Markdown pages
+- Enjoy meta tag generation
+- Generated navigation from pages
+- Leverage TailwindCSS Typography
+- Switch between light & dark mode
+- Access 100,000 icons from 100+ icon sets
+- Highlight code blocks with [Shiki](https://shiki.matsu.io)
+- Create Vue components and use them in Markdown
+- Deploy on any Node or Static hosting: GH Pages, Vercel, Netlify, Heroku, etc.
+- Live edit on [Nuxt Studio](https://nuxt.studio)
+
+## Setup
+
+::button-link
+---
+external: true
+href: https://stackblitz.com/github/Atinux/content-wind/tree/main/.demo?file=content%2F1.index.md
+icon: simple-icons:stackblitz
+---
+Play online on Stackblitz
+::
+
+Open a terminal and run the following command:
+
+```bash
+npx nuxi init -t themes/content-wind my-website
+```
+
+Follow the instructions in the terminal and you are ready to go 🚀
+
+## Usage
+
+This template has some built-in features to make it as easy as possible to create a content-driven website.
+
+### Pages
+
+Create your Markdown pages in the `content/` directory:
+
+```md [content/index.md]
+# My title
+
+This first paragraph will be treated as the page meta description.
+```
+
+You can overwrite meta tags by using front-matter:
+
+```md [content/index.md]
+---
+title: 'Custom title'
+description: 'Custom meta description'
+image: 'Custom image injected as `og:image`'
+---
+
+# My title
+
+This first paragraph will be treated as the page meta description.
+```
+
+This is done thanks to Nuxt Content's [document-driven mode](https://content.nuxtjs.org/guide/writing/document-driven) of Nuxt Content.
+
+### Navigation
+
+The navigation is generated from your pages, you can take a look at the [`<AppNavbar>`](https://github.com/Atinux/content-wind/blob/main/components/AppNavbar.vue) component to see how it works.
+
+It uses the [Navigation](https://content.nuxt.com/usage/navigation)  from Nuxt Content to fetch the navigation object.
+
+To customize the title displayed in the navigation, you can set the `navigation.title` property in the front-matter of your pages:
+
+```md
+---
+navigation.title: 'Home'
+---
+
+# Welcome to my site
+
+With a beautiful description
+```
+
+### Theme configuration
+
+You can configure Content Wind global configuration in the `app.config.ts` file:
+
+```ts [signature]
+interface AppConfigInput {
+  cover?: string, // default: '/cover.jpg'
+  socials?: {
+    twitter?: string
+    github?: string
+    mastodon?: string
+  }
+}
+```
+
+Example of settings Twitter and GitHub icons in the navbar:
+
+```ts [app.config.ts]
+export default defineAppConfig({
+  socials: {
+    twitter: 'Atinux',
+    github: 'Atinux/content-wind'
+    mastodon: '@[email protected]'
+  }
+})
+```
+
+### Icons
+
+Use any icon from [icones.js.org](https://icones.js.org) with the `<Icon>` component:
+
+```html
+<Icon name="ph:music-notes-fill" />
+```
+
+You can also use it in your Markdown:
+
+```md
+:icon{name="ph:music-notes-fill"}
+```
+
+Will result in :icon{name="ph:music-notes-fill"}
+
+Learn more on [nuxt-icon](https://github.com/nuxt-modules/icon) documentation.
+
+### Code Highlight
+
+It supports code highlighting with Shiki and as well as different [VS Code themes](https://github.com/shikijs/shiki/blob/main/docs/themes.md#all-themes).
+
+::markdown-block
+\`\`\`ts
+export default () => 'Hello Content Wind'
+\`\`\`
+::
+
+Will result in:
+
+```ts
+export default () => 'Hello Content Wind'
+```
+
+Updating the theme is as simple as editing your `nuxt.config`:
+
+```ts
+import { defineNuxtConfig } from 'nuxt'
+
+export default defineNuxtConfig({
+  content: {
+    highlight: {
+      theme: 'one-dark-pro',
+    }
+  }
+})
+```
+
+Learn more in the [Content Code Highlight section](https://content.nuxt.com/get-started/configuration#highlight).
+
+### Vue Components
+
+Add Vue components into the `components/content/` directory and start using them in Markdown.
+
+See the `<MarkdownBlock>` component in [`components/content/MarkdownBlock.vue`](https://github.com/Atinux/content-wind/blob/main/.demo/components/content/MarkdownBlock.vue).
+
+By leveraging the [`<ContentSlot>`](https://content.nuxt.com/components/content-slot) component from Nuxt Content, you can use both slots and props in Markdown thanks to the [MDC syntax](https://content.nuxt.com/usage/markdown).
+
+## Deployment
+
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FAtinux%2Fcontent-wind-template) [![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/Atinux/content-wind-template)
+
+### Static Hosting
+
+Pre-render the website to be deployed on any static hosting:
+
+```bash
+npm run generate
+```
+
+The `dist/` directory is ready to be deployed (symlink to `.output/public`), [learn more on Nuxt docs](https://nuxt.com/docs/getting-started/deployment#static-hosting).
+
+### Node server
+
+Build the application for production:
+
+```bash
+npm run build
+```
+
+Start the server in production:
+
+```bash
+node .output/server/index.mjs
+```
+
+Learn more on [Nuxt docs](https://nuxt.com/docs/getting-started/deployment) for more information.
+
+---
+
+You are at the end of the page, you can checkout the [about page](/about) or the [GitHub repository](https://github.com/Atinux/content-wind) and give a :icon{name="ph:star-duotone"}
+
+Thanks for reading and happy writing, [Atinux](https://twitter.com/Atinux).

content/2.about.md

@@ -0,0 +1,14 @@
+---
+navigation:
+  title: About
+layout: full-width
+head:
+  description: This is a custom description for Content Wind about page.
+  image: https://fastly.picsum.photos/id/866/536/354.jpg?hmac=tGofDTV7tl2rprappPzKFiZ9vDh5MKj39oa2D--gqhA
+---
+
+# About
+
+This is the about page, with a custom description and image for SEO ✨
+
+![Content Wind](https://fastly.picsum.photos/id/866/536/354.jpg?hmac=tGofDTV7tl2rprappPzKFiZ9vDh5MKj39oa2D--gqhA)

nuxt.config.ts

@@ -0,0 +1,6 @@
+export default defineNuxtConfig({
+  extends: 'content-wind',
+  routeRules: {
+    '/': { prerender: true }
+  }
+})

package.json

@@ -0,0 +1,14 @@
+{
+  "name": "content-wind-template",
+  "private": true,
+  "scripts": {
+    "dev": "nuxi dev",
+    "build": "nuxi build",
+    "generate": "nuxi generate",
+    "preview": "nuxi preview"
+  },
+  "devDependencies": {
+    "content-wind": "latest",
+    "nuxt": "latest"
+  }
+}

tsconfig.json

@@ -0,0 +1,4 @@
+{
+  // https://v3.nuxtjs.org/concepts/typescript
+  "extends": "./.nuxt/tsconfig.json"
+}