This commit is contained in:
Dominik Strangas 2024-01-29 12:12:27 +01:00
parent ce469f88bd
commit dc7baec3e6
4 changed files with 59 additions and 48 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 MiB

View File

@ -17,7 +17,7 @@ type StoryItemProps = {
export const StoryItem = (props: StoryItemProps) => { export const StoryItem = (props: StoryItemProps) => {
return ( return (
<div class="p-6 group inline-block w-full relative"> <div class="my-6 py-2 group inline-block w-full relative">
<div class="h-full flex-1 delay-75 flex flex-col justify-between group-hover:scale-[1.01] transition-all shadow-md shadow-gray-400 border-2 border-zinc-800 rounded-md py-3 px-6"> <div class="h-full flex-1 delay-75 flex flex-col justify-between group-hover:scale-[1.01] transition-all shadow-md shadow-gray-400 border-2 border-zinc-800 rounded-md py-3 px-6">
<div> <div>
<p class="text-lg font-bold">{props.item.title}</p> <p class="text-lg font-bold">{props.item.title}</p>

View File

@ -42,5 +42,17 @@ const storyItems: StoryItemType[] = [
<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
class="w-full rounded-md p-5 justify-between items-center flex gap-5 flex-row h-80 max-lg:flex-col max-lg:h-auto border-2 border-neutral-800 bg-neutral-100"
>
<div class="flex flex-col gap-5">
<p class="text-2xl font-bold">Meine Hobbys</p>
<p class="w-">
Zusätzlich zu meinen beruflichen Qualifikationen engagiere ich mich in meiner Freizeit intensiv in der Musik
und koche mit großer Begeisterung. Ebenso habe ich ein faible für Autos.
</p>
</div>
<img class="rounded-md h-full w-auto object-cover" src="/img/Bild002_Neg.Nr.1A.jpg" alt="" />
</div>
</div> </div>
</PageLayout> </PageLayout>

View File

@ -1,4 +1,3 @@
<section class="py-5 w-screen max-sm:min-h-[66vh] bg-zinc-900 text-zinc-50"> <section class="py-5 w-screen max-sm:min-h-[66vh] bg-zinc-900 text-zinc-50">
<div class="w-5/6 flex flex-col justify-around items-center h-full mx-auto gap-2"> <div class="w-5/6 flex flex-col justify-around items-center h-full mx-auto gap-2">
<p class="text-2xl underline">Mehr zu mir</p> <p class="text-2xl underline">Mehr zu mir</p>
@ -12,8 +11,7 @@
<li><img src="" alt="" /><p>- SEO</p></li> <li><img src="" alt="" /><p>- SEO</p></li>
<li><img src="" alt="" /><p>- Web-App Deployment</p></li> <li><img src="" alt="" /><p>- Web-App Deployment</p></li>
</ul> </ul>
<a class="underline text-emerald-300 visited:text-purple-300" href="/skills" class="underline">Siehe alle</a <a class="underline text-emerald-300 visited:text-purple-300" href="/skills" class="underline">Siehe alle</a>
>
</div> </div>
<div class="w-full border border-dashed border-emerald-300 sm:hidden"></div> <div class="w-full border border-dashed border-emerald-300 sm:hidden"></div>
<div class="p-4 flex flex-col gap-4 sm:flex-1 sm:flex sm:flex-col sm:items-center"> <div class="p-4 flex flex-col gap-4 sm:flex-1 sm:flex sm:flex-col sm:items-center">
@ -48,4 +46,5 @@
</div> </div>
</div> </div>
</div> </div>
<div class="w-full h-80 border bg-red-900"></div>
</section> </section>