🎉 Initial Commit

.gitignore

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

.prettierrc.json

@@ -0,0 +1,8 @@
+{
+  "$schema": "https://json.schemastore.org/prettierrc",
+  "semi": false,
+  "tabWidth": 2,
+  "singleQuote": false,
+  "printWidth": 120,
+  "trailingComma": "all"
+}

app.vue

@@ -0,0 +1,11 @@
+<template>
+  <v-app>
+    <nuxt-layout>
+      <nuxt-page />
+    </nuxt-layout>
+  </v-app>
+</template>
+
+<script setup lang="ts">
+import "@unocss/reset/tailwind.css"
+</script>

components/product/Carousel.vue

@@ -0,0 +1,45 @@
+<template>
+  <v-carousel class="carousel-section" show-arrows="hover" cycle hide-delimiters>
+    <v-carousel-item v-for="(item, i) in props.products" :key="i" :src="item?.thumbnail" cover>
+      <v-sheet color="rgba(0, 0, 0, .4)" height="calc(100% + 24px)">
+        <v-row class="fill-height" align="center" justify="center">
+          <v-col class="text-center">
+            <h1 class="text-4xl font-bold text-white" :class="item?.archived ? 'line-through' : null">
+              {{ item?.title }}
+            </h1>
+            <p class="text-lg text-white">{{ item?.description }}</p>
+
+            <div class="flex justify-center mt-3">
+              <v-btn variant="text" color="white" prepend-icon="mdi-school" text="Learn more" />
+              <v-btn
+                v-if="item?.url"
+                variant="text"
+                color="white"
+                prepend-icon="mdi-launch"
+                text="Open"
+                :href="item?.url"
+                target="_blank"
+              />
+            </div>
+            <div class="flex justify-center">
+              <v-chip
+                v-if="item?.archived"
+                label
+                prepend-icon="mdi-archive"
+                variant="text"
+                color="warning"
+                size="small"
+              >
+                Archived
+              </v-chip>
+            </div>
+          </v-col>
+        </v-row>
+      </v-sheet>
+    </v-carousel-item>
+  </v-carousel>
+</template>
+
+<script setup lang="ts">
+const props = defineProps<{ products: any[] }>()
+</script>

content/products/roadsign.mdx

@@ -0,0 +1,6 @@
+---
+thumbnail: /thumbnails/products/roadsign.webp
+title: RoadSign
+description: The reserve proxy that powered our network. Powerful and easy to use.
+archived: true
+---

content/products/solar-network.mdx

@@ -0,0 +1,6 @@
+---
+thumbnail: /thumbnails/products/solar-network.webp
+title: Solar Network
+description: Solar Network is Solsynth LLC's core product in the internet.
+url: https://lian.solsynth.dev
+---

layouts/default.vue

@@ -0,0 +1,25 @@
+<template>
+  <v-app-bar flat color="primary">
+    <v-container class="mx-auto d-flex align-center justify-center px-8">
+      <nuxt-link to="/" exact>
+        <v-avatar class="me-4" color="transparent" size="32" :image="Logo" />
+      </nuxt-link>
+
+      <v-btn variant="text" text="Products" to="/products" exact />
+
+      <v-spacer></v-spacer>
+
+      <v-btn href="https://id.solsynth.dev" target="_blank" icon>
+        <v-avatar size="small" color="transparent" icon="mdi-account-circle" />
+      </v-btn>
+    </v-container>
+  </v-app-bar>
+
+  <v-main>
+    <slot />
+  </v-main>
+</template>
+
+<script setup lang="ts">
+import Logo from "../assets/logo.png"
+</script>

nuxt.config.ts

@@ -0,0 +1,43 @@
+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 LLC",
+      titleTemplate: "%s | Solsynth",
+      link: [{ rel: "icon", type: "image/png", href: "/favicon.png" }],
+    },
+  },
+  content: {
+    api: {
+      baseURL: "/api/content",
+    },
+    highlight: {
+      theme: "github-dark",
+    },
+  },
+  build: {
+    transpile: ["vuetify"],
+  },
+  modules: [
+    "@unocss/nuxt",
+    "@nuxt/content",
+    "@nuxt/image",
+    (_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.13",
+    "@mdi/font": "^7.4.47",
+    "@nuxt/content": "^2.13.0",
+    "@nuxt/image": "^1.7.0",
+    "nuxt": "^3.12.2",
+    "vue": "latest"
+  },
+  "devDependencies": {
+    "@unocss/nuxt": "^0.61.0",
+    "@unocss/reset": "^0.61.0",
+    "vite-plugin-vuetify": "^2.0.3",
+    "vuetify": "^3.6.10"
+  }
+}

pages/index.vue

@@ -0,0 +1,78 @@
+<template>
+  <product-carousel class="carousel-section" :products="products as any[]" />
+
+  <v-container>
+    <v-row class="content-section">
+      <v-col cols="12" md="6">
+        <v-img src="/assets/logo.png" alt="Logo" max-width="300"></v-img>
+      </v-col>
+      <v-col cols="12" md="6" class="d-flex align-center">
+        <div>
+          <h1 class="text-4xl font-bold">Welcome to Solsynth</h1>
+          <p class="text-lg mt-4">
+            We specialize in creating software that delights users. Our passion is to develop intuitive, efficient, and
+            beautiful software that everyone loves to use.
+          </p>
+          <v-btn prepend-icon="mdi-magnify" color="primary" class="mt-4 mx-[-8px]">Discover More</v-btn>
+        </div>
+      </v-col>
+    </v-row>
+
+    <v-row class="content-section">
+      <v-col cols="12" class="text-center">
+        <h2 class="text-3xl font-bold">Our Expertise</h2>
+        <p class="text-lg mt-2">We excel in a wide range of software development services.</p>
+      </v-col>
+      <v-col cols="12" md="4" class="d-flex">
+        <v-card class="pa-4">
+          <v-icon large class="mb-4">mdi-laptop</v-icon>
+          <h3 class="headline">Custom Software Development</h3>
+          <p>
+            We design and develop custom software solutions tailored to your business needs, ensuring high performance
+            and scalability.
+          </p>
+        </v-card>
+      </v-col>
+      <v-col cols="12" md="4" class="d-flex">
+        <v-card class="pa-4">
+          <v-icon large class="mb-4">mdi-cellphone</v-icon>
+          <h3 class="headline">Mobile App Development</h3>
+          <p>Our team creates user-friendly and feature-rich mobile applications for both iOS and Android platforms.</p>
+        </v-card>
+      </v-col>
+      <v-col cols="12" md="4" class="d-flex">
+        <v-card class="pa-4">
+          <v-icon large class="mb-4">mdi-web</v-icon>
+          <h3 class="headline">Web Application Development</h3>
+          <p>
+            We build responsive and interactive web applications that provide a seamless user experience across all
+            devices.
+          </p>
+        </v-card>
+      </v-col>
+    </v-row>
+
+    <v-row class="content-section">
+      <v-col cols="12" class="text-center">
+        <h2 class="text-3xl font-bold">Get in Touch</h2>
+        <p class="text-lg mt-2">Ready to start your next project with us? We would love to hear from you.</p>
+        <v-btn class="mt-3" color="primary">Contact Us</v-btn>
+      </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>
+.carousel-section {
+  height: 96rem;
+}
+
+.content-section {
+  margin-top: 8rem;
+  margin-bottom: 8rem;
+}
+</style>

pages/products/[...slug].vue

@@ -0,0 +1,25 @@
+<template>
+  <v-container>
+    <content-doc>
+      <template #empty>
+        <v-empty-state
+          icon="mdi-image-broken-variant"
+          text="This product has no spefifc describe for it, yet."
+          title="No Content"
+          class="no-content-placeholder"
+        >
+          <template #actions>
+            <v-btn prepend-icon="mdi-list-box" variant="plain" text="Back to index" to="/products" exact />
+          </template>
+        </v-empty-state>
+      </template>
+    </content-doc>
+  </v-container>
+</template>
+
+<style scoped>
+.no-content-placeholder {
+  min-height: 0;
+  max-height: 64rem;
+}
+</style>

pages/products/index.vue

@@ -0,0 +1,3 @@
+<template>
+  <v-container></v-container>
+</template>

plugins/vuetify.ts

@@ -0,0 +1,38 @@
+import '@fontsource/roboto/latin.css';
+import '@mdi/font/css/materialdesignicons.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({
+    ssr: true,
+    blueprint: md3,
+    directives,
+    components: {
+      ...components,
+      ...labsComponents,
+    },
+    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,3 @@
+import { defineConfig } from "unocss"
+
+export default defineConfig({})