FIX: Directories

Better directory structure

app/components/Section/Intro.vue

@@ -0,0 +1,37 @@
+<template>
+  <section id="intro" class="Intro content full gap-default">
+    <div class="intro-text flex-col gap-default">
+      <h1 class="flex-col">
+        <span class="greeting inline-flex-row">Moin. <Icon name="ph:hand-peace-duotone" mode="svg"/></span>
+        <span class="my-name-wrapper">Ich bin <span class="highlight">Fiona</span>.</span>
+      </h1>
+      <h2>
+        Component <span class="highlight">&</span> API Entwicklerin
+      </h2>
+      <p class="fulltext">
+        Ich unterstütze Unternehmen dabei, ihre Daten von verschiedenen Endpunkten sauber aufzubereiten
+        und anschließend in einer Webapplication schön zu verpacken.
+      </p>
+      <p class="fulltext">
+        Mit über 20 Jahren Erfahrung in der Webentwicklung habe ich
+        inzwischen so ziemlich jeden Stuff miterlebt.
+      </p>
+      <p class="fulltext">
+        Egal, ob Komponenten, Schnittstellen oder Anbindung an Headless CMS.
+        Ich biete dir genau das, was du brauchst, um eine individuelle WebApp in Fahrt zu bringen, deren Inhalte einfach zu verändern sind.
+      </p>
+      <Button class="cta" href="#skills">
+        <Icon name="ph:lightbulb-duotone" size="1.5em" mode="svg" />
+        Fussel erklärt's dir
+      </Button>
+    </div>
+    <div class="intro-img">
+      <picture>
+        <source width="750" height="866" media="(min-width: 431px)" srcset="/img/profile_big.webp" />
+        <img width="430" height="866" src="/img/profile_small.webp" alt="Bild von Fiona Urban" />
+      </picture>
+    </div>
+  </section>
+</template>
+<script setup lang="ts">
+</script>