This commit is contained in:
Dominik Strangas 2024-01-17 11:50:51 +01:00
parent faf5c0f061
commit 21282db188
3 changed files with 68 additions and 68 deletions

View File

@ -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">
&#220;ber Mich &#220;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">
&#220;ber Mich &#220;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>
</> </>
); );

View File

@ -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>

View File

@ -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 &#x1F609;</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 &#x1F609;</p>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
</PageLayout> </PageLayout>