This commit is contained in:
parent
faf5c0f061
commit
21282db188
|
|
@ -36,9 +36,9 @@ export const Navigation = () => {
|
||||||
<a class="hover:underline transition-all hover:text-zinc-50" href="/mystory">
|
<a class="hover:underline transition-all hover:text-zinc-50" href="/mystory">
|
||||||
Über Mich
|
Über Mich
|
||||||
</a>
|
</a>
|
||||||
<a class="hover:underline transition-all hover:text-zinc-50" href="/skills">
|
{/* <a class="hover:underline transition-all hover:text-zinc-50" href="/skills">
|
||||||
Skills
|
Skills
|
||||||
</a>
|
</a> */}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -62,9 +62,9 @@ export const Navigation = () => {
|
||||||
<a class="hover:underline transition-all hover:text-zinc-50" href="/mystory">
|
<a class="hover:underline transition-all hover:text-zinc-50" href="/mystory">
|
||||||
Über Mich
|
Über Mich
|
||||||
</a>
|
</a>
|
||||||
<a class="hover:underline transition-all hover:text-zinc-50" href="/skills">
|
{/* <a class="hover:underline transition-all hover:text-zinc-50" href="/skills">
|
||||||
Skills
|
Skills
|
||||||
</a>
|
</a> */}
|
||||||
</nav>
|
</nav>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
|
||||||
|
|
@ -15,7 +15,7 @@ const storyItems: StoryItemType[] = [
|
||||||
{
|
{
|
||||||
title: "First Code",
|
title: "First Code",
|
||||||
description:
|
description:
|
||||||
"Mit 13 Jahren schrieb ich meine ersten Codezeilen. In den anschließenden Jahren erfolgte der Übergang von der Erstellung von Minecraft-Plugins mit Java zur Webentwicklung.",
|
"Mit 13 Jahren schrieb ich meine ersten Codezeilen. In den anschließenden Jahren erfolgte der Übergang von der Erstellung von Minecraft-Plugins mit Java zur Full-Stack Webentwicklung.",
|
||||||
image: "/img/code.png",
|
image: "/img/code.png",
|
||||||
epochTime: "2017 - 2019"
|
epochTime: "2017 - 2019"
|
||||||
},
|
},
|
||||||
|
|
@ -39,8 +39,8 @@ const storyItems: StoryItemType[] = [
|
||||||
---
|
---
|
||||||
|
|
||||||
<PageLayout>
|
<PageLayout>
|
||||||
<div class="min-h-screen w-screen p-10 bg-zinc-100">
|
<div class="min-h-screen w-screen p-10 bg-zinc-100">
|
||||||
<h1 class="text-4xl font-bold">Meine Geschichte</h1>
|
<h1 class="text-4xl font-bold">Meine Geschichte</h1>
|
||||||
<StoryItems client:load storyItems={storyItems} />
|
<StoryItems client:load storyItems={storyItems} />
|
||||||
</div>
|
</div>
|
||||||
</PageLayout>
|
</PageLayout>
|
||||||
|
|
|
||||||
|
|
@ -5,69 +5,69 @@ import Footer from "../views/Footer.astro";
|
||||||
---
|
---
|
||||||
|
|
||||||
<PageLayout>
|
<PageLayout>
|
||||||
<div class="w-screen flex flex-col">
|
<div class="w-screen flex flex-col">
|
||||||
<div class="flex-1 w-screen bg-zinc-900 flex justify-center items-center py-8 px-12">
|
<div class="flex-1 w-screen bg-zinc-900 flex justify-center items-center py-8 px-12">
|
||||||
<div class="grid grid-cols-1 2xl:grid-cols-2 grid-rows-3 xl:w-1/2 h-full gap-7">
|
<div class="grid grid-cols-1 2xl:grid-cols-2 grid-rows-3 xl:w-1/2 h-full gap-7">
|
||||||
<div
|
<div
|
||||||
class="col-span-1 2xl:row-span-2 bg-purple-300 rounded-2xl transition hover:scale-[1.02] p-6 duration-300 flex flex-col justify-between"
|
class="col-span-1 2xl:row-span-2 bg-purple-300 rounded-2xl transition hover:scale-[1.02] p-6 duration-300 flex flex-col justify-between"
|
||||||
>
|
>
|
||||||
<a target="_blank" class="group" href="https://github.com/ZktSn0w/ColrJS">
|
<a target="_blank" class="group" href="https://github.com/ZktSn0w/ColrJS">
|
||||||
<p class="text-2xl underline font-bold font-mono group-hover:text-emerald-500 text-emerald-800 transition">
|
<p class="text-2xl underline font-bold font-mono group-hover:text-emerald-500 text-emerald-800 transition">
|
||||||
ColrJs
|
ColrJs
|
||||||
</p>
|
</p>
|
||||||
</a>
|
</a>
|
||||||
<div class="flex flex-col gap-4">
|
<div class="flex flex-col gap-4">
|
||||||
<p class="font-mono text-lg break-words">
|
<p class="font-mono text-lg break-words">
|
||||||
Ein schlankes, modernes und erweiterbares Farbpalettenextraktionswerkzeug, das im Browser oder in einem
|
Ein schlankes, modernes und erweiterbares Farbpalettenextraktionswerkzeug, das im Browser oder in einem
|
||||||
Node.js-Kontext verwendet werden kann.
|
Node.js-Kontext verwendet werden kann.
|
||||||
</p>
|
</p>
|
||||||
<p class="font-mono text-lg break-words">
|
<p class="font-mono text-lg break-words">
|
||||||
Dank dieser Bibliothek konnte ich mein Abschlussprojekt während meiner Ausbildung erfolgreich realisieren.
|
Dank dieser Bibliothek konnte ich mein Abschlussprojekt während meiner Ausbildung erfolgreich realisieren.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p class="font-mono font-bold text-zinc-700">
|
<p class="font-mono font-bold text-zinc-700">
|
||||||
Colaborated with: <span class="text-emerald-700 underline"
|
Colaborated with: <span class="text-emerald-700 underline"
|
||||||
><a target="_blank" href="https://iamsebastian.dev/">IamSebastianDev</a></span
|
><a target="_blank" href="https://iamsebastian.dev/">IamSebastianDev</a></span
|
||||||
>
|
>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="col-span-1 row-span-1 bg-emerald-300 rounded-2xl transition hover:scale-[1.02] p-6 duration-300 flex flex-col justify-between"
|
|
||||||
>
|
|
||||||
<p class="font-mono font-bold text-2xl">Portfolio</p>
|
|
||||||
<p class="font-mono text-lg break-words">
|
|
||||||
Mein Portfolio habe ich dem modernen Framework <span class="text-purple-700 underline font-bold"
|
|
||||||
><a target="_blank" href="https://astro.build/">Astro</a></span
|
|
||||||
> erstellt, um eine beeindruckende Online-Präsenz zu präsentieren.
|
|
||||||
</p>
|
|
||||||
<p class="ont-mono text-sm break-words">Weitere verwendete Technologien: TailwindCSS, SolidJS</p>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="col-span-1 2xl:row-start-2 2xl:col-start-2 bg-yellow-300 rounded-2xl transition hover:scale-[1.02] p-6 duration-300 flex flex-col justify-between"
|
|
||||||
>
|
|
||||||
<div>
|
|
||||||
<p class="font-mono font-bold text-2xl">SolidJS Component Library</p>
|
|
||||||
<p class="font-mono font-bold text-base text-zinc-500">In Progress...</p>
|
|
||||||
</div>
|
</div>
|
||||||
<p class="font-mono">
|
<div
|
||||||
Ich arbeite derzeit an einer Component-Library für SolidJS, um die Entwicklung von Webanwendungen zu
|
class="col-span-1 row-span-1 bg-emerald-300 rounded-2xl transition hover:scale-[1.02] p-6 duration-300 flex flex-col justify-between"
|
||||||
optimieren und benutzerfreundlicher zu gestalten.
|
>
|
||||||
</p>
|
<p class="font-mono font-bold text-2xl">Portfolio</p>
|
||||||
<p></p>
|
<p class="font-mono text-lg break-words">
|
||||||
</div>
|
Mein Portfolio habe ich mit dem modernen Framework <span class="text-purple-700 underline font-bold"
|
||||||
<div
|
><a target="_blank" href="https://astro.build/">Astro</a></span
|
||||||
class="c2xl:col-span-2 2xl:row-start-3 bg-emerald-300 rounded-2xl transition hover:scale-[1.02] p-6 duration-300 grid grid-rows-3 grid-cols-1"
|
> erstellt, um eine schöne Online-Präsenz zu präsentieren.
|
||||||
>
|
</p>
|
||||||
<div>
|
<p class="ont-mono text-sm break-words">Weitere verwendete Technologien: TailwindCSS, SolidJS</p>
|
||||||
<p class="font-mono font-bold text-2xl">Weitere Projekte</p>
|
|
||||||
<p class="font-mono font-bold text-base text-zinc-500">Soon...</p>
|
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div
|
||||||
<p class="font-mono text-base">Wer weiß, <br />vielleicht kommen bald weitere Projekte dazu 😉</p>
|
class="col-span-1 2xl:row-start-2 2xl:col-start-2 bg-yellow-300 rounded-2xl transition hover:scale-[1.02] p-6 duration-300 flex flex-col justify-between"
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
<p class="font-mono font-bold text-2xl">SolidJS Component Library</p>
|
||||||
|
<p class="font-mono font-bold text-base text-zinc-500">In Progress...</p>
|
||||||
|
</div>
|
||||||
|
<p class="font-mono">
|
||||||
|
Ich arbeite derzeit an einer Component-Library für SolidJS, um die Entwicklung von Webanwendungen zu
|
||||||
|
optimieren und benutzerfreundlicher zu gestalten.
|
||||||
|
</p>
|
||||||
|
<p></p>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="c2xl:col-span-2 2xl:row-start-3 bg-emerald-300 rounded-2xl transition hover:scale-[1.02] p-6 duration-300 grid grid-rows-3 grid-cols-1"
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
<p class="font-mono font-bold text-2xl">Weitere Projekte</p>
|
||||||
|
<p class="font-mono font-bold text-base text-zinc-500">Soon...</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="font-mono text-base">Wer weiß, <br />vielleicht kommen bald weitere Projekte dazu 😉</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</PageLayout>
|
||||||
</PageLayout>
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue