From aef697534c38260e49c406e5b3e7edabc5b4310d Mon Sep 17 00:00:00 2001
From: webfussel <fiona@webfussel.de>
Date: Wed, 28 May 2025 10:14:20 +0200
Subject: [PATCH] ADD: FreeInfo component

for better handling
---
 app/components/Booking.vue  | 9 ++++-----
 app/components/Flatrate.vue | 4 ++++
 app/components/FreeInfo.vue | 6 ++++++
 3 files changed, 14 insertions(+), 5 deletions(-)
 create mode 100644 app/components/FreeInfo.vue

diff --git a/app/components/Booking.vue b/app/components/Booking.vue
index 2afa6ab..0c091f4 100755
--- a/app/components/Booking.vue
+++ b/app/components/Booking.vue
@@ -5,15 +5,12 @@
     <p class="margin-top">Hinter diesen Angeboten gibt es <span class="highlight">keinerlei Abos oder versteckte Kosten</span>.
       Aus Transparenzgründen sei aber gesagt, dass sich <span class="highlight">*alle Preise zzgl. 19 % Umsatzsteuer</span>. verstehen.</p>
 
-    <article class="z-2 card flex-col margin-top font-big text-center">
-      <p>Derzeit habe ich <span class="highlight">keine freien Plätze</span>.</p>
-      <p class="margin-top-small">Das ändert sich ab <span class="highlight">01. Januar 2026</span>.</p>
-    </article>
-
     <h3 class="margin-top-big">One off Projekte</h3>
     <p class="margin-top-small">Manchmal brauchen wir alle einfach nur eine Kleinigkeit und will sich nicht lange binden. Das ist natürlich
       völlig in Ordnung und genau deshalb biete ich dir die Möglichkeit mich gezielt für <span class="highlight">kleinere Projekte</span> zu buchen.</p>
 
+    <FreeInfo />
+
     <div class="Pricing margin-top">
       <article v-for="(service, index) in oneOff" :class="{ 'z-3-all': index === 1, 'z-2-all': index !== 1}">
         <header>
@@ -55,6 +52,8 @@
 </template>
 
 <script setup lang="ts">
+import FreeInfo from './FreeInfo.vue'
+
 type Service = {
   title: string
   smallClaim: string
diff --git a/app/components/Flatrate.vue b/app/components/Flatrate.vue
index da9e12e..22454c3 100755
--- a/app/components/Flatrate.vue
+++ b/app/components/Flatrate.vue
@@ -6,6 +6,8 @@
     <p class="margin-top">Bei dir fällt ständig was an oder du hast ein langlaufendes Projekt, bei dem du immer wieder mal Unterstützung brauchst? Kein Ding.
       Hier gibt's die <span class="highlight">Entwickler-Flat</span> für planbare Kosten und On-Demand-Entwicklung. Aus Transparenzgründen sei aber gesagt, dass sich <span class="highlight">*alle Preise zzgl. 19 % Umsatzsteuer</span>. verstehen.</p>
 
+    <FreeInfo />
+
     <div class="Pricing margin-top">
       <article v-for="(service, index) in flatrate" :class=" { 'z-2' : index === 1, 'z-1' : index !== 1 }">
         <header>
@@ -47,6 +49,8 @@
 </template>
 
 <script setup lang="ts">
+import FreeInfo from './FreeInfo.vue'
+
 type Service = {
   title: string
   smallClaim: string
diff --git a/app/components/FreeInfo.vue b/app/components/FreeInfo.vue
new file mode 100644
index 0000000..6f7ecd0
--- /dev/null
+++ b/app/components/FreeInfo.vue
@@ -0,0 +1,6 @@
+<template>
+  <article class="z-2 card flex-col margin-top font-big text-center">
+    <p>Derzeit habe ich <span class="highlight">keine freien Plätze</span>.</p>
+    <p class="margin-top-small">Das ändert sich ab <span class="highlight">01. Januar 2026</span>.</p>
+  </article>
+</template>
\ No newline at end of file