+
{BLOG.TITLE}
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 1a928ba..ba81734 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,8 +1,8 @@
---
import { getCollection } from "astro:content";
import PageLayout from "@/layouts/PageLayout.astro";
-// import ArrowCard from "@components/ArrowCard";
-// import StackCard from "@components/StackCard.astro";
+import ArrowCard from "@/components/ArrowCard.astro";
+import StackCard from "@/components/StackCard.astro";
import { SITE, SOCIALS } from "@/consts";
const posts = (await getCollection("blog"))
@@ -18,22 +18,22 @@ const projects = (await getCollection("projects"))
const stack = [
{
text: "Astro",
- icon: "astro",
+ icon: "material-icon-theme:astro",
href: "https://astro.build",
},
{
text: "Javascript",
- icon: "javascript",
+ icon: "devicon:javascript",
href: "https://www.javascript.com",
},
{
text: "Typescript",
- icon: "typescript",
+ icon: "devicon:typescript",
href: "https://www.typescriptlang.org",
},
{
text: "Tailwind",
- icon: "tailwind",
+ icon: "devicon:tailwindcss",
href: "https://tailwindcss.com",
},
];
@@ -41,7 +41,7 @@ const stack = [
-
+
-
+
@@ -116,16 +116,22 @@ const stack = [
a cli-tool. I am motivated by challenging projects where
I have to research and learn new concepts.
- Now
+ Now
- I currently study computer science at
+ I am currently pursuing a Master's degree in Computer
+ Science at
Paderborn University
- with economics as my minor subject, while also getting a peek
- at electrical engineering & maths in my regular subject.
+ rel="noopener noreferrer"
+ class="font-departure">Paderborn University. During my bachelor's program, I gained insight into
+ electrical engineering and mathematics. Through
+ extracurricular studies, I have learned about economics.
+ In the master's program, I can take a broader variety of
+ courses, including quantum computation, security,
+ machine learning, and lesser-known fields such as
+ knowledge representation.
@@ -134,7 +140,9 @@ const stack = [
-
-
-
-
- Website build with
-
-
- {
- stack.map((item) => (
- //
-
{JSON.stringify(item, undefined, 2)}
- ))
- }
-
-
-
diff --git a/src/pages/projects/index.astro b/src/pages/projects/index.astro
index c2c82a4..2715381 100644
--- a/src/pages/projects/index.astro
+++ b/src/pages/projects/index.astro
@@ -17,7 +17,7 @@ const tags = [
-
+
{PROJECTS.TITLE}
diff --git a/src/pages/work/index.astro b/src/pages/work/index.astro
index 0016f05..1a9109f 100644
--- a/src/pages/work/index.astro
+++ b/src/pages/work/index.astro
@@ -43,14 +43,14 @@ function formatWorkDate(input: Date | string) {
{
work.map((entry) => (
-
+
{formatWorkDate(entry.data.dateStart)} -{" "}
{formatWorkDate(entry.data.dateEnd)}
-
+
{entry.data.company}
-
+
{entry.data.role}
diff --git a/src/styles/global.css b/src/styles/global.css
index e358531..2237427 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -10,6 +10,7 @@
font-style: normal;
font-display: swap;
}
+
@font-face {
font-family: "FiraCode";
src: url("/fonts/FiraCode-Regular.woff") format("woff");
@@ -17,6 +18,7 @@
font-style: normal;
font-display: swap;
}
+
@font-face {
font-family: "FiraCode";
src: url("/fonts/FiraCode-Bold.woff") format("woff");
@@ -28,19 +30,19 @@
html {
overflow-y: scroll;
color-scheme: light;
- background-color: white;
+ background-color: oklch(87.1% 0.006 286.286);
font-family: "FiraCode", monospace;
}
html.dark {
color-scheme: dark;
- background-color: black;
+ background-color: oklch(21% 0.006 285.885);
}
html,
body {
@apply h-full w-full antialiased;
- @apply bg-white dark:bg-black;
+ @apply bg-white dark:bg-zinc-900;
@apply text-black/75 dark:text-white/75;
}
@@ -49,7 +51,7 @@
}
main {
- @apply flex flex-col flex-1 bg-white dark:bg-black;
+ @apply flex flex-col flex-1 bg-zinc-300 dark:bg-zinc-900;
}
header {
@@ -62,7 +64,7 @@
}
header.scrolled {
- @apply bg-white/75 dark:bg-black/50;
+ @apply bg-zinc-200/75 dark:bg-zinc-950/50;
@apply border-black/10 dark:border-white/25;
@apply backdrop-blur-sm saturate-200;
}
@@ -79,6 +81,17 @@
@apply transition-all duration-300 ease-in-out;
}
+ .animate {
+ opacity: 0;
+ transform: translateY(5px);
+ transition: opacity 1s ease, transform 1s ease;
+ }
+
+ .animate.show {
+ opacity: 1;
+ transform: translateY(0);
+ }
+
article img {
padding-top: 20px;
padding-bottom: 20px;