project setup with core files including configuration, package management, and basic structure. Added .gitignore, README, and various TypeScript types for CMS components. Implemented initial components and layouts for the application.

middlelayer/types/README.md

@@ -0,0 +1,98 @@
+# Type Structure
+
+## Übersicht
+
+Die Typen sind in zwei Kategorien aufgeteilt:
+
+### 1. CMS-Typen (`types/cms/`)
+**Zweck:** Struktur, wie Daten vom CMS (Contentful) kommen
+
+- `*Skeleton` - Wrapper mit `contentTypeId` und `fields`
+- Verwendet `ComponentLayout` (ist jetzt ein Alias für `contentLayout`)
+- Beispiel: `ComponentHeadlineSkeleton`, `HTMLSkeleton`, `MarkdownSkeleton`
+
+**Verwendung:** Nur im Mapper (`mappers/pageMapper.ts`) und Mock-Daten (`adapters/Mock/_cms/`)
+
+**Dateien:**
+- `Headline.ts`, `Html.ts`, `Markdown.ts`, `Iframe.ts`, `ImageGallery.ts`, `Image.ts`, `Quote.ts`, `YoutubeVideo.ts`
+- `Page.ts`, `Navigation.ts`, `SEO.ts`, `FullwidthBanner.ts`
+- `Layout.ts` - `ComponentLayout` (Alias für `contentLayout`)
+- `ContentType.enum.ts` - Enum für alle Content-Typen
+
+### 2. Domain-Typen (`types/c_*.ts`, `types/page.ts`, etc.)
+**Zweck:** Struktur, wie Daten in der App verwendet werden
+
+- `c_*` - Content-Item-Typen mit `type`-Feld für Discriminated Union
+- Verwendet `contentLayout` direkt
+- Beispiel: `c_headline`, `c_html`, `c_markdown`, `c_iframe`, `c_imageGallery`, `c_image`, `c_quote`, `c_youtubeVideo`
+
+**Verwendung:** Überall in der App (GraphQL Schema, Astro Components, etc.)
+
+**Dateien:**
+- `c_*.ts` - Alle Content-Item-Typen
+- `page.ts` - Page-Typ mit `ContentItem` Union und `ContentRow`
+- `contentLayout.ts` - Einheitlicher Layout-Typ
+- `pageSeo.ts`, `navigation.ts`, `product.ts`, `user.ts` - Weitere Domain-Typen
+
+## Mapping
+
+Der `PageMapper` konvertiert von CMS-Typen zu Domain-Typen:
+
+```typescript
+// Beispiel: Headline
+CMS: ComponentHeadlineSkeleton {
+  contentTypeId: ContentType.headline,
+  fields: {
+    internal: string,
+    text: string,
+    tag: "h1" | "h2" | ...,
+    align?: "left" | "center" | "right",
+    layout: ComponentLayout
+  }
+}
+↓ (PageMapper.mapContentItem)
+Domain: c_headline {
+  type: "headline",
+  internal: string,
+  text: string,
+  tag: "h1" | "h2" | ...,
+  align?: "left" | "center" | "right",
+  layout: contentLayout
+}
+```
+
+## Layout-Typen
+
+- `ComponentLayout` (in `types/cms/Layout.ts`) = Alias für `contentLayout`
+- `contentLayout` (in `types/contentLayout.ts`) = Einheitlicher Layout-Typ für alle Content-Items
+
+**Struktur:**
+```typescript
+{
+  mobile: string;        // z.B. "12", "6", "4"
+  tablet?: string;       // Optional, z.B. "8", "6"
+  desktop?: string;      // Optional, z.B. "6", "4"
+  spaceBottom?: number;  // Optional, z.B. 0, 0.5, 1, 1.5, 2
+}
+```
+
+**Warum:** Redundanz vermeiden - beide haben die gleiche Struktur. `ComponentLayout` ist nur ein Alias, um die Semantik klar zu machen (CMS vs Domain).
+
+## Content-Items Union
+
+Alle Content-Items werden in `types/page.ts` zu einer Union zusammengefasst:
+
+```typescript
+export type ContentItem =
+  | c_html
+  | c_markdown
+  | c_iframe
+  | c_imageGallery
+  | c_image
+  | c_quote
+  | c_youtubeVideo
+  | c_headline;
+```
+
+Dies ermöglicht Type-Safe Discriminated Unions über das `type`-Feld.
+