initial

.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.config.ts

@@ -0,0 +1,8 @@
+export default defineAppConfig({
+  ui: {
+    container: {
+      padding: "p-4 sm:p-6 lg:p-8",
+      constrained: "max-w-3xl",
+    },
+  },
+});

app.vue

@@ -0,0 +1,16 @@
+<script setup lang="ts">
+useSeoMeta({
+  title: "Marios Antonoudiou",
+  ogTitle: "Marios Antonoudiou",
+  description:
+    "An experienced software engineer. Enabling teams and crafting user interfaces at Celonis",
+  ogDescription:
+    "An experienced software engineer. Enabling teams and crafting user interfaces at Celonis",
+  twitterCard: "summary_large_image",
+});
+</script>
+<template>
+  <Introduction />
+  <BeenWorkingWith />
+  <Connect />
+</template>

components/been-working-with.vue

@@ -0,0 +1,39 @@
+<template>
+  <UContainer class="flex flex-col gap-5">
+    <div class="text-sm text-gray-500">Been working with</div>
+    <Company logo="celonis-logo.webp" href="https://celonis.com">
+      <template v-slot:title>Celonis</template>
+      <template v-slot:description>
+        Process mining and execution management software
+      </template>
+    </Company>
+
+    <Company logo="chat-engineers-logo.webp" href="https://chatengineers.com">
+      <template v-slot:title>Chat Engineers</template>
+      <template v-slot:description>
+        Apps and customization for the Livechat platform
+      </template>
+    </Company>
+
+    <Company logo="lenses-logo.webp" href="https://lenses.io">
+      <template v-slot:title>Lenses</template>
+      <template v-slot:description>
+        Data-ops platform for Apache Kafka
+      </template>
+    </Company>
+
+    <Company logo="commversion-logo.webp" href="https://commversion.com">
+      <template v-slot:title>Commversion</template>
+      <template v-slot:description>
+        Conversational marketing platform
+      </template>
+    </Company>
+
+    <Company logo="up-logo.webp" href="https://uphellas.gr">
+      <template v-slot:title>Up Hellas</template>
+      <template v-slot:description>
+        Digital-first employee benefits that transform the workplace experience
+      </template>
+    </Company>
+  </UContainer>
+</template>

components/company.vue

@@ -0,0 +1,37 @@
+<script setup lang="ts">
+interface Props {
+  logo: string;
+  href?: string;
+}
+
+const props = defineProps<Props>();
+</script>
+
+<template>
+  <div class="flex gap-5">
+    <NuxtLink :to="props.href" target="_blank" class="block">
+      <NuxtImg
+        placeholder
+        :src="props.logo"
+        class="block rounded min-w-[50px]"
+        height="50"
+        width="50"
+        fit="outside"
+      />
+    </NuxtLink>
+    <div class="flex flex-col justify-center">
+      <NuxtLink
+        :href="props.href"
+        target="_blank"
+        class="text-xl font-semibold hover:underline hover:underline-offset-4"
+      >
+        <slot name="title">Company</slot>
+      </NuxtLink>
+      <div class="text-sm text-gray-500">
+        <slot name="description">
+          Lorem ipsum, dolor sit amet consectetur adipisicing elit.
+        </slot>
+      </div>
+    </div>
+  </div>
+</template>

components/connect.vue

@@ -0,0 +1,51 @@
+<template>
+  <UContainer class="flex flex-col gap-5">
+    <div class="text-sm text-gray-500">Let's connect</div>
+
+    <div class="flex gap-4 overflow-x-auto">
+      <UButton
+        color="purple"
+        icon="i-heroicons-arrow-right-circle"
+        class="rounded-full"
+        variant="soft"
+        target="_blank"
+        to="https://www.calendar.com/mariosant/short-video-call"
+      >
+        Calendar
+      </UButton>
+
+      <UButton
+        color="green"
+        icon="i-heroicons-arrow-right-circle"
+        class="rounded-full"
+        variant="soft"
+        target="_blank"
+        to="mailto:mariosant@sent.com"
+      >
+        Email
+      </UButton>
+
+      <UButton
+        color="orange"
+        icon="i-heroicons-arrow-right-circle"
+        class="rounded-full"
+        variant="soft"
+        target="_blank"
+        to="https://github.com/mariosant"
+      >
+        Github
+      </UButton>
+
+      <UButton
+        color="blue"
+        icon="i-heroicons-arrow-right-circle"
+        class="rounded-full"
+        variant="soft"
+        target="_blank"
+        to="https://www.linkedin.com/in/mariosant/"
+      >
+        Linkedin
+      </UButton>
+    </div>
+  </UContainer>
+</template>

components/introduction.vue

@@ -0,0 +1,25 @@
+<template>
+  <UContainer class="flex flex-col md:gap-12 gap-5">
+    <nuxt-img
+      placeholder
+      src="mariosant.webp"
+      width="64"
+      height="64"
+      class="w-16 h-16 rounded-full border"
+    />
+    <div class="md:text-xl text-lg font-semibold">
+      <ULink
+        class="text-blue-500 hover:underline hover:underline-offset-4"
+        to="mailto:mariosant@sent.com"
+        >Marios Antonoudiou</ULink
+      >, an experienced software engineer.<br />
+      Enabling teams and crafting user interfaces at
+      <ULink
+        to="https://celonis.com"
+        target="_blank"
+        class="text-green-500 hover:underline hover:underline-offset-4"
+        >Celonis</ULink
+      >.
+    </div>
+  </UContainer>
+</template>

components/section.vue

@@ -0,0 +1,7 @@
+<template>
+  <div class="w-screen">
+    <section class="p-14 mx-auto max-w-3xl">
+      <slot />
+    </section>
+  </div>
+</template>

nuxt.config.ts

@@ -0,0 +1,5 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+  devtools: { enabled: true },
+  modules: ["@nuxt/ui", "@nuxt/image"],
+});

package.json

@@ -0,0 +1,23 @@
+{
+  "name": "nuxt-app",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "nuxt build",
+    "dev": "nuxt dev",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview",
+    "postinstall": "nuxt prepare"
+  },
+  "devDependencies": {
+    "@nuxt/devtools": "latest",
+    "@nuxt/image": "latest",
+    "nuxt": "^3.8.2",
+    "vue": "^3.3.8",
+    "vue-router": "^4.2.5"
+  },
+  "dependencies": {
+    "@nuxt/ui": "^2.11.0",
+    "sharp": "^0.33.0"
+  }
+}

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"
+}