initial commit

Author: Nerajno

.env.example

@@ -0,0 +1,3 @@
+# Create one with no scope selected on https://github.com/settings/tokens/new
+# This token is used for fetching the repository releases.
+GITHUB_TOKEN=

.gitignore

@@ -0,0 +1,12 @@
+node_modules
+*.iml
+.idea
+*.log*
+.nuxt
+.vscode
+.DS_Store
+coverage
+dist
+sw.*
+.env
+.output

.npmrc

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

README.md

@@ -0,0 +1,57 @@
+# Alpine Starter
+
+Starter template for [Alpine](https://alpine.nuxt.space).
+
+## Clone
+
+Clone the repository (using `nuxi`):
+
+```bash
+npx nuxi init -t themes/alpine
+```
+
+## Setup
+
+Install dependencies:
+
+```bash
+pnpm install
+```
+
+## Development
+
+```bash
+pnpm dev
+```
+
+## Edge Side Rendering
+
+Can be deployed to Vercel Functions, Netlify Functions, AWS, and most Node-compatible environments.
+
+Look at all the available presets [here](https://v3.nuxtjs.org/guide/deploy/presets).
+
+```bash
+pnpm build
+```
+
+## Static Generation
+
+Use the `generate` command to build your application.
+
+The HTML files will be generated in the .output/public directory and ready to be deployed to any static compatible hosting.
+
+```bash
+pnpm generate
+```
+
+## Preview build
+
+You might want to preview the result of your build locally, to do so, run the following command:
+
+```bash
+pnpm preview
+```
+
+---
+
+For a detailed explanation of how things work, check out [Alpine](https://alpine.nuxt.space).

app.config.ts

@@ -0,0 +1,41 @@
+export default defineAppConfig({
+  alpine: {
+    title: 'Alpine',
+    description: 'The minimalist blog theme',
+    image: {
+      src: '/social-card-preview.png',
+      alt: 'An image showcasing my project.',
+      width: 400,
+      height: 300
+    },
+    header: {
+      position: 'right', // possible value are : | 'left' | 'center' | 'right'
+      logo: {
+        path: '/logo.svg', // path of the logo
+        pathDark: '/logo-dark.svg', // path of the logo in dark mode, leave this empty if you want to use the same logo
+        alt: 'alpine' // alt of the logo
+      }
+    },
+    footer: {
+      credits: {
+        enabled: true, // possible value are : true | false
+        repository: 'https://www.github.com/nuxt-themes/alpine' // our github repository
+      },
+      navigation: true, // possible value are : true | false
+      alignment: 'center', // possible value are : 'none' | 'left' | 'center' | 'right'
+      message: 'Follow me on' // string that will be displayed in the footer (leave empty or delete to disable)
+    },
+    socials: {
+      twitter: 'nuxtlabs',
+      instagram: 'atinuxt',
+      linkedin: {
+        icon: 'uil:linkedin',
+        label: 'LinkedIn',
+        href: 'https://www.linkedin.com/company/nuxtlabs'
+      }
+    },
+    form: {
+      successMessage: 'Message sent. Thank you!'
+    }
+  }
+})

content/1.index.md

@@ -0,0 +1,31 @@
+---
+layout: default
+head.title: Home
+description: An open source blog theme powered by Nuxt.
+title: About / HomePage
+---
+
+::hero
+---
+image: '/alpine-0.webp'
+---
+#title
+Hi, Nerando
+#description
+- An [open source blog theme](https://github.com/nuxt-themes/alpine) powered by [Nuxt Content](https://content.nuxtjs.org), editable on [Nuxt Studio](https://studio.nuxt.com).
+- Write pages in Markdown and Vue components with the [MDC syntax](https://content.nuxtjs.org/guide/writing/mdc).
+- Use [**30+ built-in**](https://elements.nuxt.space) components in your Markdown pages.
+::
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim.
+
+Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim. Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh. Mauris ac mauris sed pede pellentesque fermentum. Maecenas adipiscing ante non diam sodales hendrerit.
+
+::gallery
+---
+images:
+  - /alpine-0.webp
+  - /alpine-1.webp
+  - /alpine-2.webp
+---
+::

content/2.articles.md

@@ -0,0 +1,10 @@
+---
+title: 'Articles'
+layout: 'page'
+---
+
+::articles-list
+---
+path: articles
+---
+::

content/3.contact.md

@@ -0,0 +1,32 @@
+---
+title: 'Contact'
+layout: 'default'
+# Custom og:image
+---
+
+# Get in touch
+
+::contact-form
+---
+fields:
+  - type: 'text'
+    name: 'name'
+    label: 'Your name'
+    required: true
+
+  - type: 'email'
+    name: 'email'
+    label: 'Your email'
+    required: true
+
+  - type: 'text'
+    name: 'subject'
+    label: 'Subject'
+    required: false
+
+  - type: 'textarea'
+    name: 'message'
+    label: 'Message'
+    required: true
+---
+::

content/articles/1.get-started.md

@@ -0,0 +1,76 @@
+---
+cover: /articles/get-started.webp
+author:
+  name: Sébastien Chopin
+  avatarUrl: https://pbs.twimg.com/profile_images/1042510623962275840/1Iw_Mvud_400x400.jpg
+  link: https://twitter.com/atinux
+date: 2022-08-23
+layout: article
+---
+
+# Get started with Alpine
+
+Creating a blog with Alpine is a command away, as well as deploying to many platforms.
+
+## Create a blog
+
+Open a terminal an run the following command:
+
+```bash
+npx nuxi@latest init -t themes/alpine
+```
+
+## Dependencies
+
+Next, go to to `my-blog/` directory and install the dependencies:
+
+```bash
+npm install
+```
+
+## Development
+
+Start the development server on port 3000:
+
+```bash
+npm run dev
+```
+
+Next, you can start creating your content in Markdown in the `content/` directory.
+
+
+## Deploy
+
+### Static hosting
+
+You can deploy Alpine to any static hosting by running the following command:
+
+```bash
+npm run generate
+```
+
+This command will create a `dist/` directory with the compiled files ready to be uploaded to any static hosting.
+
+### Edge platforms
+
+Alpine supports deploying to the following platforms with **zero configuration**:
+
+- [Vercel](https://vercel.com)
+- [Netlify](https://netlify.com)
+- [and more...](https://v3.nuxtjs.org/guide/deploy/presets#supported-hosting-providers)
+
+### Node server
+
+You can deploy Alpine to a Node server by running the following command:
+
+```bash
+npm run build
+```
+
+This command will create a `.output/` directory with the compiled files ready to be uploaded to any Node server.
+
+To start the production server, run the following command:
+
+```bash
+node .output/server/index.mjs
+```

content/articles/2.configure.md

@@ -0,0 +1,92 @@
+---
+cover: /articles/configure-alpine.webp
+author:
+  name: Clément Ollivier
+  avatarUrl: https://pbs.twimg.com/profile_images/1370286658432724996/ZMSDzzIi_400x400.jpg
+  link: https://twitter.com/clemcodes
+date: 2022-08-23
+description: Learn how to configure Alpine with the app.config.ts file.
+layout: article
+---
+
+# Configure Alpine
+
+To configure meta tags, social links or even the Alpine theme display, update the `alpine` key in the `app.config.ts` at the root of your project:
+
+```ts [app.config.ts]
+export default defineAppConfig({
+  alpine: {
+    /* Alpine configuration goes here */
+  }
+}
+```
+
+You can look at the [default config](https://github.com/nuxt-themes/alpine/tree/dev/app.config.ts).
+
+The [config schema](https://github.com/nuxt-themes/alpine/tree/dev/app.config.ts) also gives comments on all the configuration parameters.
+
+## Meta tags
+
+Configure the title, description and social image of your website:
+
+```ts [app.config.ts]
+export default defineAppConfig({
+  alpine: {
+    title: 'Alpine',
+    description: 'The minimalist blog theme',
+    image: '/social-card-preview.png',
+    // image can also be an object:
+    image: {
+      src: '/social-card-preview.png',
+      alt: 'An image showcasing my project.',
+      width: 400,
+      height: 300
+    }
+  }
+})
+```
+
+## Social links
+
+To configure the social links displayed in the footer, use the `socials` property:
+
+```ts [app.config.ts]
+export default defineAppConfig({
+  alpine: {
+    socials: {
+      twitter: 'nuxtlabs',
+      instagram: 'wearenuxt',
+      linkedin: {
+        icon: 'uil:linkedin',
+        label: 'LinkedIn',
+        href: 'https://www.linkedin.com/company/nuxtlabs'
+      }
+    }
+  }
+})
+```
+
+## Theme display
+
+Alpine Header and Footer can also be customized via the `app.config.ts` file:
+
+```ts [app.config.ts]
+defineAppConfig({
+  alpine: {
+    // Remove header with header: false
+    header: {
+      position: 'inline', // possible value are : 'none' | 'left' | 'center' | 'right' | 'inline'
+      logo: false
+    },
+    // Remove header with footer: false
+    footer: {
+      credits: {
+        enabled: true, // possible value are : true | false
+        repository: 'https://www.github.com/nuxt-themes/alpine' // our github repository
+      },
+      navigation: false, // possible value are : true | false
+      position: 'center', // possible value are : 'none' | 'left' | 'center' | 'right'
+      message: 'Follow me on' // string that will be displayed on the footer (leave empty or delete to disable)
+  }
+})
+```