🎉 Initial Commit

.gitignore

@@ -0,0 +1,24 @@
+# Nuxt dev/build outputs
+.output
+.data
+.nuxt
+.nitro
+.cache
+dist
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
+.env
+.env.*
+!.env.example

README.md

@@ -0,0 +1,75 @@
+# Nuxt 3 Minimal Starter
+
+Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
+
+## Setup
+
+Make sure to install the dependencies:
+
+```bash
+# npm
+npm install
+
+# pnpm
+pnpm install
+
+# yarn
+yarn install
+
+# bun
+bun install
+```
+
+## Development Server
+
+Start the development server on `http://localhost:3000`:
+
+```bash
+# npm
+npm run dev
+
+# pnpm
+pnpm run dev
+
+# yarn
+yarn dev
+
+# bun
+bun run dev
+```
+
+## Production
+
+Build the application for production:
+
+```bash
+# npm
+npm run build
+
+# pnpm
+pnpm run build
+
+# yarn
+yarn build
+
+# bun
+bun run build
+```
+
+Locally preview production build:
+
+```bash
+# npm
+npm run preview
+
+# pnpm
+pnpm run preview
+
+# yarn
+yarn preview
+
+# bun
+bun run preview
+```
+
+Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.

app.vue

@@ -0,0 +1,8 @@
+<template>
+  <v-app>
+    <nuxt-layout>
+      <nuxt-loading-indicator />
+      <nuxt-page />
+    </nuxt-layout>
+  </v-app>
+</template>

content/products/solarpass.md

@@ -0,0 +1,6 @@
+---
+icon: "https://id.solsynth.dev/favicon.svg"
+name: "Solarpass"
+code: "Hydrogen.Solarpass"
+description: "The unified identity service for Solar Network."
+---

layouts/default.vue

@@ -0,0 +1,26 @@
+<template>
+  <v-app-bar flat scroll-behavior="elevated">
+    <v-container class="mx-auto d-flex align-center justify-center">
+      <v-avatar
+        class="me-4"
+        color="transparent"
+        size="32"
+        image="/favicon.svg"
+      ></v-avatar>
+
+      <nuxt-link v-for="link in navbars" :to="link.to">
+        <v-btn variant="text">{{ link.label }}</v-btn>
+      </nuxt-link>
+
+      <v-spacer></v-spacer>
+    </v-container>
+  </v-app-bar>
+
+  <v-main class="bg-grey-lighten-3 min-h-[calc(100vh - 64px)]">
+    <slot />
+  </v-main>
+</template>
+
+<script setup lang="ts">
+const navbars = [{ label: "Home", to: "/" }];
+</script>

nuxt.config.ts

@@ -0,0 +1,42 @@
+import vuetify, { transformAssetUrls } from "vite-plugin-vuetify";
+
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+  devtools: { enabled: true },
+
+  app: {
+    head: {
+      title: "Solsynth",
+      meta: [
+        {
+          name: "description",
+          content:
+            "Solsynth LLC official website. We build amazing, wonderful, open-source software.",
+        },
+      ],
+      link: [{ rel: "icon", type: "image/xml+svg", href: "/favicon.svg" }],
+    },
+  },
+  content: {},
+
+  build: {
+    transpile: ["vuetify"],
+  },
+  modules: [
+    "@unocss/nuxt",
+    "@nuxt/content",
+    (_options, nuxt) => {
+      nuxt.hooks.hook("vite:extendConfig", (config) => {
+        // @ts-expect-error
+        config.plugins.push(vuetify({ autoImport: true }));
+      });
+    },
+  ],
+  vite: {
+    vue: {
+      template: {
+        transformAssetUrls,
+      },
+    },
+  },
+});

package.json

@@ -0,0 +1,26 @@
+{
+  "name": "nuxt-app",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "nuxt build",
+    "dev": "nuxt dev",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview",
+    "postinstall": "nuxt prepare"
+  },
+  "dependencies": {
+    "@fontsource/roboto": "^5.0.12",
+    "@mdi/font": "^7.4.47",
+    "@nuxt/content": "^2.12.1",
+    "nuxt": "^3.10.3",
+    "vue": "^3.4.21",
+    "vue-router": "^4.3.0"
+  },
+  "devDependencies": {
+    "@unocss/nuxt": "^0.58.6",
+    "@unocss/reset": "^0.58.6",
+    "vite-plugin-vuetify": "^2.0.3",
+    "vuetify": "^3.5.9"
+  }
+}

pages/index.vue

@@ -0,0 +1,132 @@
+<template>
+  <v-container>
+    <v-row class="h-fullpage" align-content="center" id="landing">
+      <v-col :xs="12" :sm="6" class="max-md:text-center">
+        <img
+          src="/assets/products/solar.svg"
+          class="w-[180px] h-[192px] max-md:mx-auto"
+        />
+        <h1 class="text-6xl font-bold mt-8">
+          <span class="text-primary">Internet.</span> <br />
+          <span>Redefined.</span>
+        </h1>
+
+        <p class="text-lg mt-3">This is, the Solar Network.</p>
+
+        <div class="mt-12 w-full flex max-md:justify-center">
+          <v-btn
+            append-icon="mdi-magnify"
+            variant="tonal"
+            size="large"
+            href="#about"
+          >
+            Explore more
+          </v-btn>
+        </div>
+      </v-col>
+
+      <v-col
+        :xs="12"
+        :sm="6"
+        class="flex items-center max-md:justify-center md:justify-end"
+      >
+        <v-card class="w-full">
+          <img src="/assets/products/feature.jpg" class="object-cover" />
+        </v-card>
+      </v-col>
+    </v-row>
+
+    <v-row class="h-fullpage" align-content="center" id="about">
+      <v-col :xs="12" :sm="6" class="max-md:text-center">
+        <v-icon
+          icon="mdi-information-slab-symbol"
+          size="48"
+          color="grey-darken-3"
+          class="mb-3 mx-[-16px]"
+        />
+        <h1 class="text-2xl font-bold">About us</h1>
+        <p>
+          We are a group of developers who are love open-source. Founded in
+          2019. We've been building open-source software that people love ever
+          since. For us, "By open-source, for open-source" is not only a
+          principle, but also the motto of our faith.
+        </p>
+
+        <div class="mt-3 w-full flex max-md:justify-center">
+          <v-btn
+            class="mx-[-16px]"
+            append-icon="mdi-shape"
+            variant="text"
+            href="#products"
+          >
+            Discover products
+          </v-btn>
+        </div>
+      </v-col>
+
+      <v-col
+        :xs="12"
+        :sm="6"
+        class="flex flex-col gap-2 max-md:items-center md:items-end"
+      >
+        <v-card hover class="pa-5">
+          <template #text>
+            <img src="/favicon.svg" width="128" height="128" />
+          </template>
+        </v-card>
+        <p class="uppercase caption">Crystal Lotus</p>
+        <p class="text-sm opacity-80 mt-[-8px] md:text-right">
+          A crystal flower born in GoatLand. <br />
+          Home flower of Solsynth. <br />
+          Mr. Sheep felt homesick every time he saw it.
+        </p>
+      </v-col>
+    </v-row>
+
+    <v-row
+      class="h-fullpage text-center"
+      align-content="center"
+      justify="center"
+      id="products"
+    >
+      <v-col :cols="12">
+        <h2 class="text-2xl font-bold">Products</h2>
+        <p>Let's see what we got.</p>
+
+        <div class="mt-4 flex justify-center gap-2">
+          <v-tooltip v-for="item in products" location="top">
+            <template #activator="{ props }">
+              <v-card v-bind="props" hover class="w-24 h-24">
+                <div class="h-full w-full flex justify-center items-center">
+                  <img :src="item.icon" width="64" height="64" class="block" />
+                </div>
+              </v-card>
+            </template>
+
+            <div>
+              <p class="font-bold">{{ item.title }}</p>
+              <p class="font-mono text-xs">{{ item.code }}</p>
+              <p class="mt-2">{{ item.description }}</p>
+            </div>
+          </v-tooltip>
+        </div>
+      </v-col>
+    </v-row>
+  </v-container>
+</template>
+
+<script setup lang="ts">
+const { data: products } = await useAsyncData("products", () =>
+  queryContent("products").limit(5).find()
+);
+</script>
+
+<style scoped>
+.h-fullpage {
+  height: calc(100vh - 64px);
+}
+
+.caption {
+  letter-spacing: 2px;
+}
+</style>

plugins/unocss.ts

@@ -0,0 +1,4 @@
+import "@unocss/reset/tailwind.css"
+import "@fontsource/roboto/latin.css"
+
+export default defineNuxtPlugin(() => {})

plugins/vuetify.ts

@@ -0,0 +1,36 @@
+import "@mdi/font/css/materialdesignicons.min.css";
+
+import "vuetify/styles";
+import { createVuetify } from "vuetify";
+import { md3 } from "vuetify/blueprints";
+import * as components from "vuetify/components";
+import * as labsComponents from "vuetify/labs/components";
+import * as directives from "vuetify/directives";
+
+export default defineNuxtPlugin((app) => {
+  const vuetify = createVuetify({
+    directives,
+    components: {
+      ...components,
+      ...labsComponents,
+    },
+    blueprint: md3,
+    theme: {
+      defaultTheme: "original",
+      themes: {
+        original: {
+          colors: {
+            primary: "#4a5099",
+            secondary: "#2196f3",
+            accent: "#009688",
+            error: "#f44336",
+            warning: "#ff9800",
+            info: "#03a9f4",
+            success: "#4caf50",
+          },
+        },
+      },
+    },
+  });
+  app.vueApp.use(vuetify);
+});

server/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "../.nuxt/tsconfig.server.json"
+}

tsconfig.json

@@ -0,0 +1,4 @@
+{
+  // https://nuxt.com/docs/guide/concepts/typescript
+  "extends": "./.nuxt/tsconfig.json"
+}

uno.config.ts

@@ -0,0 +1,5 @@
+import { defineConfig, presetAttributify, presetTypography, presetUno } from "unocss";
+
+export default defineConfig({
+  presets: [presetAttributify(), presetTypography(), presetUno({ preflight: false })]
+})