fixed layout and added new vcard

keystatic.config.ts

@@ -39,7 +39,7 @@ export default config({
       path: 'src/content/about/*',
       format: { contentField: 'content' },
       schema: {
-        name: fields.text({ label: "Name" }),
+        name: fields.slug({ name: { label: "Name" } }),
         location: fields.text({ label: "Location" }),
         content: fields.markdoc({
           label: 'Content',

node.Dockerfile

@@ -1,5 +1,5 @@
 # Use Node.js base image for build stage
-FROM node:20.12.2 AS build
+FROM node:slim AS build
 
 # Set working directory
 WORKDIR /app

src/components/About.astro

@@ -1,9 +1,10 @@
 ---
-import { getCollection, getEntry } from "astro:content";
+import { getCollection, getEntries, getEntry } from "astro:content";
 import type { AboutEntry } from "../types/about";
 import "../styles/global.css";
 
-const about: AboutEntry = await getEntry("about", "oliver");
+const about: AboutEntry = await getEntry("about", "oliver-deutsch");
+
 ---
 
 <div class="grid justify-center">
@@ -20,6 +21,7 @@ const about: AboutEntry = await getEntry("about", "oliver");
             </a>
             <div class="grid auto-cols-max grid-flow-col">
                 <svg
+                    class="fill-red-600"
                     xmlns="http://www.w3.org/2000/svg"
                     height="24px"
                     viewBox="0 -960 960 960"

src/components/ContactCard.astro

@@ -18,7 +18,6 @@ const contact: ContactEntry = await getEntry("contact", "about");
                     Contact me via e-mail
                 </h5>
             </a>
-            <!-- replace email -->
             <a
                 href={"mailto:" + contact.data.email}
                 class="flex items-center bg-blue-600 mt-3 hover:bg-blue-700 text-white py-2 px-4 rounded"
@@ -31,13 +30,21 @@ const contact: ContactEntry = await getEntry("contact", "about");
                 >
                     <path
                         d="M120-160v-640l760 320-760 320Zm80-120 474-200-474-200v140l240 60-240 60v140Zm0 0v-400 400Z"
-                    />
+                    ></path>
                 </svg>
                 Send a mail
             </a>
         </div>
-
+        <h5
+            class="text-center mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white"
+        >
+            vCard
+        </h5>
         <!-- replace qr code -->
-        <img class="h-auto max-w-lg rounded-lg" src="/vCard.png" alt="image description">
+        <img
+            class="h-auto max-w-lg rounded-lg"
+            src="/vCard.png"
+            alt="image description"
+        />
     </div>
 </div>

src/components/Navbar.astro

@@ -1,7 +1,7 @@
 <nav class="bg-white dark:bg-gray-900 fixed w-full z-20 top-0 start-0 border-b border-gray-200 dark:border-gray-600">
   <div class="max-w-screen-xl flex flex-wrap items-center justify-between mx-auto p-4">
   <a href="/" class="flex items-center space-x-3 rtl:space-x-reverse">
-    <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M240-200h120v-240h240v240h120v-360L480-740 240-560v360Zm-80 80v-480l320-240 320 240v480H520v-240h-80v240H160Zm320-350Z"/></svg>
+    <svg class="fill-blue-600" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M240-200h120v-240h240v240h120v-360L480-740 240-560v360Zm-80 80v-480l320-240 320 240v480H520v-240h-80v240H160Zm320-350Z"/></svg>
   </a>
   <div class="flex md:order-2 space-x-3 md:space-x-0 rtl:space-x-reverse">
       <a href="/contact" class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">Contact</a>

src/content/about/Oliver.mdoc

@@ -1,5 +0,0 @@
----
-location: Somewhere
-name: Oliver
----
-test

src/content/about/oliver-deutsch.mdoc

@@ -0,0 +1,5 @@
+---
+name: Oliver Deutsch
+location: 'Germany, Mecklenburg–Western Pomerania '
+---
+test

src/content/posts/forward-ports-via-a-reverse-ssh-tunnel-using-docker.mdoc

@@ -0,0 +1,6 @@
+---
+title: Forward Ports via a Reverse SSH Tunnel using Docker
+link: >-
+  https://medium.com/@zilione/forward-ports-via-a-reverse-ssh-tunnel-using-docker-ec74723e1773
+---
+If you are looking for a way to forward a service like a website from a restricted NAT and have an exposable host like a virtual private server in the cloud, then follow along with this setup.

src/content/projects/video-transcriber.mdoc

@@ -1,6 +0,0 @@
----
-title: Video Transcriber
-demo: http://192.168.178.82:8282/
-source: http://192.168.178.77:10880/Liontix/video-transcriber-frontend
----
-This project is a frontend web app that transcribes youtube videos.

src/pages/index.astro

@@ -11,7 +11,7 @@ export const prerender = true;
 <Layout>
 	<Navbar />
 	<div class="m-10"></div>
-	<main class="container mx-auto pt-12">
+	<main class="container mx-auto pt-12 w-3/4">
 		<About />
 		<div class="m-5"></div>
 		<ProjectList />