Initial commit

2024-12-02 12:28:35 +01:00
commit dc264b89a1
89 changed files with 31377 additions and 0 deletions
--- a/packages/base-design/Classes/Domain/Finishers/GetResponseFinisher.php
+++ b/packages/base-design/Classes/Domain/Finishers/GetResponseFinisher.php
@@ -0,0 +1,121 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Cloonar\BaseDesign\Domain\Finishers;
+
+use TYPO3\CMS\Core\Utility\GeneralUtility;
+use TYPO3\CMS\Core\Http\RequestFactory;
+use TYPO3\CMS\Form\Domain\Finishers\Exception\FinisherException;
+use Symfony\Component\Mime\Address;
+
+class GetResponseFinisher extends \TYPO3\CMS\Form\Domain\Finishers\AbstractFinisher
+{
+
+  const GET_RESPONSE_REQUEST_URL = 'https://api.getresponse.com/v3';
+
+  /**
+   * @var \TYPO3\CMS\Core\Http\RequestFactory
+   */
+  protected $request;
+
+  /**
+   * @var array
+   */
+  protected $defaultOptions = [
+    'notifyEmail' => '',
+    'apiKey' => '',
+    'campaignId' => '',
+    'email' => '',
+    'firstname' => '',
+    'lastname' => '',
+    'company' => '',
+    'register' => false,
+  ];
+
+  /**
+   * Executes this finisher
+   * @see AbstractFinisher::execute()
+   *
+   * @throws FinisherException
+   */
+  protected function executeInternal()
+  {
+
+    $notifyEmail = $this->parseOption('notifyEmail');
+    $apiKey = $this->parseOption('apiKey');
+    $campaignId = $this->parseOption('campaignId');
+    $email = $this->parseOption('email');
+    $firstname = $this->parseOption('firstname');
+    $lastname = $this->parseOption('lastname');
+    $company = $this->parseOption('compandy');
+    $register = $this->parseOption('register');
+
+    if ($register != "1") {
+      return;
+    }
+
+    if (empty($notifyEmail)) {
+      throw new FinisherException('The option "notifyEmail" must be set for the GetResponseFinisher.', 1681331285);
+    }
+    if (empty($apiKey)) {
+      throw new FinisherException('The option "apiKey" must be set for the GetResponseFinisher.', 1681331286);
+    }
+    if (empty($campaignId)) {
+      throw new FinisherException('The option "campaignId" must be set for the GetResponseFinisher.', 1681331287);
+    }
+    if (empty($email)) {
+      throw new FinisherException('The option "email" must be set for the GetResponseFinisher.', 1681331288);
+    }
+    if (empty($firstname)) {
+      throw new FinisherException('The option "firstname" must be set for the GetResponseFinisher.', 1681331289);
+    }
+    if (empty($lastname)) {
+      throw new FinisherException('The option "lastname" must be set for the GetResponseFinisher.', 1681331290);
+    }
+
+    $data = [
+        "name" => $firstname.' '.$lastname,
+        "email" => $email,
+        "campaign" => [
+            "campaignId" => $campaignId
+        ]
+    ];
+
+
+    $request = GeneralUtility::makeInstance(RequestFactory::class);
+    $response = $request->request(
+      self::GET_RESPONSE_REQUEST_URL.'/contacts',
+      'POST',
+      [
+        'headers' => [
+          'X-Auth-Token' => 'api-key '.$apiKey,
+          'Content-Type' => 'application/json'
+        ],
+        'body' => json_encode($data)
+      ]
+    );
+
+    if ($response->getStatusCode() == 200) {
+      $mail = GeneralUtility::makeInstance(MailMessage::class);
+      $mail
+          ->from(new Address('noreply@cloonar.dev'))
+          ->to(
+              new Address($notifyEmail)
+          )
+          ->subject('Newsletter Anmeldung')
+          ->text('Vorname: '.$firstname.'\r\nNachname: '.$lastname.'\r\nFirma: '.$company.'\r\nEmail: '.$email)
+          ->send();
+    }
+  }
+
+  /**
+   * @param $string
+   * @return string
+   */
+  protected static function escapeString($string)
+  {
+    $string = htmlspecialchars($string);
+    return (string)$string;
+  }
+}
--- a/packages/base-design/Configuration/Form/Setup.yaml
+++ b/packages/base-design/Configuration/Form/Setup.yaml
@@ -0,0 +1,7 @@
+TYPO3:
+  CMS:
+    Form:
+      persistenceManager:
+        allowSaveToExtensionPaths: true
+        allowedExtensionPaths:
+          1727355960: EXT:base_design/Resources/Private/Forms/
--- a/packages/base-design/Configuration/TCA/Overrides/101_sys_template.php
+++ b/packages/base-design/Configuration/TCA/Overrides/101_sys_template.php
@@ -0,0 +1,20 @@
+<?php
+
+/*
+ * This file is part of the package bk2k/bootstrap-package.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE file that was distributed with this source code.
+ */
+
+defined('TYPO3') || die();
+
+/***************
+ * TypoScript: Full Package
+ * This includes the full setup including all configurations
+ */
+\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addStaticFile(
+    'base_design',
+    'Configuration/TypoScript',
+    'Cloonar Base Design'
+);
--- a/packages/base-design/Configuration/TCA/Overrides/102_tt_content.php
+++ b/packages/base-design/Configuration/TCA/Overrides/102_tt_content.php
@@ -0,0 +1,19 @@
+<?php
+
+/*
+ * This file is part of the package bk2k/bootstrap-package.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE file that was distributed with this source code.
+ */
+
+defined('TYPO3') or die('Access denied.');
+
+$GLOBALS['TCA']['tt_content']['columns']['space_after_class']['config']['items'][6] = [
+  'LLL:EXT:base_design/Resources/Private/Language/locallang_ttc.xlf:space_class_zero',
+  'zero'
+];
+$GLOBALS['TCA']['tt_content']['columns']['space_before_class']['config']['items'][6] = [
+  'LLL:EXT:base_design/Resources/Private/Language/locallang_ttc.xlf:space_class_zero',
+  'zero'
+];
--- a/packages/base-design/Configuration/TCA/Overrides/500_cropping.php
+++ b/packages/base-design/Configuration/TCA/Overrides/500_cropping.php
@@ -0,0 +1,148 @@
+<?php
+
+/*
+ * This file is part of the package bk2k/bootstrap-package.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE file that was distributed with this source code.
+ */
+
+defined('TYPO3') or die('Access denied.');
+
+// Add crop variants
+$defaultCropSettings = [
+    'title' => 'LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:option.default',
+    'allowedAspectRatios' => [
+        '16:9' => [
+            'title' => 'LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:ratio.16_9',
+            'value' => 16 / 9
+        ],
+        '4:3' => [
+            'title' => 'LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:ratio.4_3',
+            'value' => 4 / 3
+        ],
+        '1:1' => [
+            'title' => 'LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:ratio.1_1',
+            'value' => 1.0
+        ],
+        'NaN' => [
+            'title' => 'LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:ratio.free',
+            'value' => 0.0
+        ],
+    ],
+    'selectedRatio' => 'NaN',
+    'cropArea' => [
+        'x' => 0.0,
+        'y' => 0.0,
+        'width' => 1.0,
+        'height' => 1.0,
+    ]
+];
+$xlargeCropSettings = $defaultCropSettings;
+$xlargeCropSettings['title'] = 'LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:option.xlarge';
+$largeCropSettings = $defaultCropSettings;
+$largeCropSettings['title'] = 'LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:option.large';
+$mediumCropSettings = $defaultCropSettings;
+$mediumCropSettings['title'] = 'LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:option.medium';
+$smallCropSettings = $defaultCropSettings;
+$smallCropSettings['title'] = 'LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:option.small';
+$extrasmallCropSettings = $defaultCropSettings;
+$extrasmallCropSettings['title'] = 'LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:option.extrasmall';
+
+// Content Element Background Image
+$GLOBALS['TCA']['tt_content']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+$GLOBALS['TCA']['tt_content']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+$GLOBALS['TCA']['tt_content']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+$GLOBALS['TCA']['tt_content']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+$GLOBALS['TCA']['tt_content']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+$GLOBALS['TCA']['tt_content']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+
+// Image content element
+$GLOBALS['TCA']['tt_content']['types']['image']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['image']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['image']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['image']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['image']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['image']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+
+// Textpic content element
+$GLOBALS['TCA']['tt_content']['types']['textpic']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['textpic']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['textpic']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['textpic']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['textpic']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['textpic']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+
+// Media content element
+$GLOBALS['TCA']['tt_content']['types']['media']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['media']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['media']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['media']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['media']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['media']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+
+// Textmedia content element
+$GLOBALS['TCA']['tt_content']['types']['textmedia']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['textmedia']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['textmedia']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['textmedia']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['textmedia']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+$GLOBALS['TCA']['tt_content']['types']['textmedia']['columnsOverrides']['assets']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+
+// Card Group
+$GLOBALS['TCA']['tx_bootstrappackage_card_group_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_card_group_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_card_group_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_card_group_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_card_group_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_card_group_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+
+// Accordion
+$GLOBALS['TCA']['tx_bootstrappackage_accordion_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_accordion_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_accordion_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_accordion_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_accordion_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_accordion_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+
+// Carousel Background Image
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['background_image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+
+// Carousel Image
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_carousel_item']['columns']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+
+// Tab
+$GLOBALS['TCA']['tx_bootstrappackage_tab_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_tab_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_tab_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_tab_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_tab_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_tab_item']['types']['1']['columnsOverrides']['media']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+
+// Timeline
+$GLOBALS['TCA']['tx_bootstrappackage_timeline_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_timeline_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_timeline_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_timeline_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_timeline_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+$GLOBALS['TCA']['tx_bootstrappackage_timeline_item']['types']['1']['columnsOverrides']['image']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+
+// Pages
+foreach ([1, 3, 4] as $type) {
+    $GLOBALS['TCA']['pages']['types'][$type]['columnsOverrides']['thumbnail']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['default'] = $defaultCropSettings;
+    $GLOBALS['TCA']['pages']['types'][$type]['columnsOverrides']['thumbnail']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['xlarge'] = $xlargeCropSettings;
+    $GLOBALS['TCA']['pages']['types'][$type]['columnsOverrides']['thumbnail']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['large'] = $largeCropSettings;
+    $GLOBALS['TCA']['pages']['types'][$type]['columnsOverrides']['thumbnail']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['medium'] = $mediumCropSettings;
+    $GLOBALS['TCA']['pages']['types'][$type]['columnsOverrides']['thumbnail']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['small'] = $smallCropSettings;
+    $GLOBALS['TCA']['pages']['types'][$type]['columnsOverrides']['thumbnail']['config']['overrideChildTca']['columns']['crop']['config']['cropVariants']['extrasmall'] = $extrasmallCropSettings;
+}
--- a/packages/base-design/Configuration/TSconfig/News.tsconfig
+++ b/packages/base-design/Configuration/TSconfig/News.tsconfig
@@ -0,0 +1,4 @@
+tx_news.templateLayouts {
+  1 = Zahl des Monats Layout
+  2 = Startseite
+}
--- a/packages/base-design/Configuration/TypoScript/constants.typoscript
+++ b/packages/base-design/Configuration/TypoScript/constants.typoscript
@@ -0,0 +1,72 @@
+config {
+    concatenateJs = 1
+    compressJs = 1
+    compressCss = 1
+    concatenateCss = 1
+}
+
+page {
+  logo {
+    file = EXT:base_design/Resources/Public/Images/logo.png
+    fileInverted = EXT:base_design/Resources/Public/Images/logo.png
+  }
+
+  theme {
+    cookieconsent {
+      enable = 0
+    }
+    navigation {
+      type = top
+    }
+    breadcrumb {
+      enable = 0
+    }
+    language {
+      enable = 0
+    }
+    meta {
+      enable = 0
+    }
+    copyright {
+      # cat=bootstrap package: copyright/169/120; type=boolean; label=Copyright: Enable to display the copyright
+      enable = 1
+      # cat=bootstrap package: copyright/169/121; type=string; label=Copyright Text
+      text = © Copyright 2024 <b>Cloonar Technologies GmbH</b>
+    }
+    googleFont {
+      enable = 0
+    }
+  }
+  fluidtemplate {
+    templateRootPath = EXT:base_design/Resources/Private/Templates/Page/
+    partialRootPath = EXT:base_design/Resources/Private/Partials/Page/
+    layoutRootPath = EXT:base_design/Resources/Private/Layouts/Page/
+  }
+}
+
+plugin.tx_news {
+  settings {
+    list.media.image {
+      maxWidth = 200c
+      maxHeight = 200c
+    }
+    detail.media.image.lightbox {
+      enabled = 0
+      class = lightbox
+      width = 800m
+      height = 600m
+    }
+  }
+}
+
+plugin.tx_indexedsearch.settings.targetPid = 10
+
+plugin.bootstrap_package {
+  settings {
+    scss {
+      primary = #ed1847
+      secondary = #ffffff
+    }
+  }
+}
+
--- a/packages/base-design/Configuration/TypoScript/setup.typoscript
+++ b/packages/base-design/Configuration/TypoScript/setup.typoscript
@@ -0,0 +1,136 @@
+page {
+  shortcutIcon = EXT:base_design/Resources/Public/Images/favicon.png
+  includeCSS {
+    zTheme = EXT:base_design/Resources/Public/Scss/main.scss
+  }
+  includeJSFooterlibs {
+    ajaxnews = EXT:base_design/Resources/Public/JavaScript/newsAjaxPagination.js
+    search = EXT:base_design/Resources/Public/JavaScript/search.js
+    matomo = EXT:base_design/Resources/Public/JavaScript/matomo.js
+  }
+  10 {
+    settings {
+      pageIds {
+        search = {$plugin.tx_indexedsearch.settings.targetPid}
+      }
+    }
+  }
+}
+
+config {
+  spamProtectEmailAddresses = 2
+  spamProtectEmailAddresses_atSubst = @
+}
+
+plugin {
+  tx_news {
+    view {
+      templateRootPaths {
+        0 = EXT:news/Resources/Private/Templates/
+        1 = EXT:base_design/Resources/Private/Templates/News
+      }
+      partialRootPaths {
+        0 = EXT:news/Resources/Private/Partials/
+        1 = EXT:base_design/Resources/Private/Partials/News
+      }
+    }
+    settings {
+      displayDummyIfNoMedia = 0
+      cropMaxCharacters = 500
+      responsiveimages {
+        news {
+          multiplier {
+            default = 0.5
+            large = 0.5
+            medium = 0.5
+          }
+          gutters {
+            default = 40
+            large = 40
+            medium = 40
+          }
+        }
+        variants {
+          default {
+            breakpoint = 1400
+            width = 1280
+          }
+          xlarge {
+            breakpoint = 1200
+            width = 1100
+          }
+          large {
+            breakpoint = 992
+            width = 920
+          }
+          medium {
+            breakpoint = 768
+            width = 680
+          }
+          small {
+            breakpoint = 576
+            width = 500
+          }
+          extrasmall {
+            breakpoint = unset
+            width = 374
+          }
+        }
+      }
+      list {
+        media.image {
+          maxWidth = 150c
+          maxHeight = 150c
+        }
+        paginate.templatePath = EXT:news/Resources/Private/Templates/Styles/Twb/Templates/ViewHelpers/Widget/Paginate/IndexAjax.html
+      }
+      detail.media.image.lightbox {
+        enabled = 1
+        class = lightbox
+        rel = lightbox-group-news
+        width = 800
+        height = 600
+      }
+      search {
+        paginate {
+          class = GeorgRinger\NumberedPagination\NumberedPagination
+          itemsPerPage = 10
+          insertAbove = 1
+          insertBelow = 1
+          maximumNumberOfLinks = 3
+        }
+      }
+    }
+  }
+  tx_form.settings.yamlConfigurations {
+    1681331285 = EXT:base_design/Configuration/Yaml/Finishers/GetResponse.yaml
+  }
+  tx_kesearch_pi1 {
+    view {
+      templateRootPaths {
+          9 = EXT:base_design/Resources/Private/Templates/Search/
+      }
+      partialRootPaths {
+          9 = EXT:base_design/Resources/Private/Partials/Search/
+      }
+    }
+  }
+  tx_kesearch_pi2.view < plugin.tx_kesearch_pi1.view
+  tx_kesearch_pi3.view < plugin.tx_kesearch_pi1.view
+}
+
+
+############################
+#### CONTENT ELEMENTS ######
+############################
+lib.contentElement {
+    layoutRootPaths {
+        15 = EXT:base_design/Resources/Private/Layouts/ContentElements/
+    }
+    templateRootPaths {
+        15 = EXT:base_design/Resources/Private/Templates/ContentElements/
+    }
+    partialRootPaths {
+        15 = EXT:base_design/Resources/Private/Partials/ContentElements/
+    }
+}
--- a/packages/base-design/Configuration/Yaml/Finishers/GetResponse.yaml
+++ b/packages/base-design/Configuration/Yaml/Finishers/GetResponse.yaml
@@ -0,0 +1,141 @@
+TYPO3:
+   CMS:
+    Form:
+      prototypes:
+        standard:
+          formElementsDefinition:
+            Form:
+              formEditor:
+                editors:
+                  900:
+                    selectOptions:
+                      1681331285:
+                        value: GetResponse
+                        label: GetResponse Finisher
+                propertyCollections:
+                  finishers:
+                    1681331285:
+                      identifier: GetResponse
+                      editors:
+                        100:
+                          identifier: header
+                          label: GetResponse
+                          templateName: Inspector-CollectionElementHeaderEditor
+                        105:
+                          identifier: 'notifyEmail'
+                          templateName: 'Inspector-TextEditor'
+                          label: 'Notify email'
+                          propertyPath: 'options.notifyEmail'
+                          propertyValidators:
+                            10: 'NotEmpty'
+                        110:
+                          identifier: 'apiKey'
+                          templateName: 'Inspector-TextEditor'
+                          label: 'API Key'
+                          propertyPath: 'options.apiKey'
+                          propertyValidators:
+                            10: 'NotEmpty'
+                        120:
+                          identifier: 'campaignId'
+                          templateName: 'Inspector-TextEditor'
+                          label: 'Campaign ID'
+                          propertyPath: 'options.campaignId'
+                          propertyValidators:
+                            10: 'NotEmpty'
+                        130:
+                          identifier: 'email'
+                          templateName: 'Inspector-TextEditor'
+                          label: 'Subscribers email'
+                          propertyPath: 'options.email'
+                          enableFormelementSelectionButton: true
+                          propertyValidators:
+                            10: 'NotEmpty'
+                            20: 'FormElementIdentifierWithinCurlyBracesInclusive'
+                        150:
+                          identifier: 'firstname'
+                          templateName: 'Inspector-TextEditor'
+                          label: 'Subscribers firstname'
+                          propertyPath: 'options.firstname'
+                          enableFormelementSelectionButton: true
+                          propertyValidators:
+                            10: 'NotEmpty'
+                            20: 'FormElementIdentifierWithinCurlyBracesInclusive'
+                        160:
+                          identifier: 'lastname'
+                          templateName: 'Inspector-TextEditor'
+                          label: 'Subscribers lastname'
+                          propertyPath: 'options.lastname'
+                          enableFormelementSelectionButton: true
+                          propertyValidators:
+                            10: 'NotEmpty'
+                            20: 'FormElementIdentifierWithinCurlyBracesInclusive'
+                        170:
+                          identifier: 'company'
+                          templateName: 'Inspector-TextEditor'
+                          label: 'Subscribers company'
+                          propertyPath: 'options.company'
+                          enableFormelementSelectionButton: true
+                          propertyValidators:
+                            10: 'FormElementIdentifierWithinCurlyBracesInclusive'
+                        180:
+                          identifier: 'register'
+                          templateName: 'Inspector-TextEditor'
+                          label: 'Register boolean'
+                          propertyPath: 'options.register'
+                          enableFormelementSelectionButton: true
+                          propertyValidators:
+                            10: 'FormElementIdentifierWithinCurlyBracesInclusive'
+                        9999:
+                          indentifier: removeButton
+                          templateName: Inspector-RemoveElementEditor
+          finishersDefinition:
+            GetResponse:
+              implementationClassName: 'Cloonar\BaseDesign\Domain\Finishers\GetResponseFinisher'
+              formEditor:
+                iconIdentifier: 'form-finisher'
+                label: 'GetResponse Finisher'
+                predefinedDefaults:
+                  options:
+                    notifyEmail: ''
+                    apiKey: ''
+                    campaignId: ''
+                    email: {}
+                    firstname: {}
+                    lastname: {}
+                    company: {}
+                    register: {}
+              FormEngine:
+                label: 'GetResponse Finisher'
+                elements:
+                  notifyEmail:
+                    label: 'Notify email'
+                    config:
+                      type: 'text'
+                  apiKey:
+                    label: 'API key'
+                    config:
+                      type: 'text'
+                  campaignId:
+                    label: 'Campaign ID'
+                    config:
+                      type: 'text'
+                  email:
+                    label: 'Subscribers email'
+                    config:
+                      type: 'text'
+                  firstname:
+                    label: 'Subscribers firstname'
+                    config:
+                      type: 'text'
+                  lastname:
+                    label: 'Subscribers lastname'
+                    config:
+                      type: 'text'
+                  company:
+                    label: 'Subscribers company'
+                    config:
+                      type: 'text'
+                  register:
+                    label: 'Register Subscriber'
+                    config:
+                      type: 'text'
--- a/packages/base-design/Resources/Private/Forms/newsletter.form.yaml
+++ b/packages/base-design/Resources/Private/Forms/newsletter.form.yaml
@@ -0,0 +1,121 @@
+
+renderingOptions:
+  submitButtonLabel: Anmelden
+type: Form
+identifier: newsletter
+label: Newsletter
+prototypeName: standard
+finishers:
+  -
+    options:
+      notifyEmail: dominik.polakovics@cloonar.com
+      apiKey: 28a7270df8f61a296a11d3e63d5b2aaf
+      campaignId: 4Etb5
+      email: '{email-1}'
+      firstname: '{text-1}'
+      lastname: '{text-2}'
+      company: '{text-3}'
+      register: '{checkbox-1}'
+    identifier: GetResponse
+  -
+    options:
+      message: 'Vielen Dank für Ihre Anmeldung !'
+      contentElementUid: ''
+    identifier: Confirmation
+renderables:
+  -
+    renderingOptions:
+      previousButtonLabel: 'Previous step'
+      nextButtonLabel: 'Next step'
+    type: Page
+    identifier: page-1
+    label: 'Newsletter Anmeldung'
+    renderables:
+      -
+        properties:
+          text: 'Melden Sie sich zu unserem Newsletter an, um top News zu erhalten!'
+        type: StaticText
+        identifier: statictext-1
+        label: ''
+      -
+        type: GridRow
+        identifier: gridrow-1
+        label: 'Grid: Row'
+        renderables:
+          -
+            defaultValue: ''
+            type: Text
+            identifier: text-1
+            label: Vorname
+            properties:
+              fluidAdditionalAttributes:
+                placeholder: Vorname
+                required: required
+              gridColumnClassAutoConfiguration:
+                viewPorts:
+                  xs:
+                    numbersOfColumnsToUse: '12'
+            validators:
+              -
+                identifier: NotEmpty
+          -
+            defaultValue: ''
+            type: Text
+            identifier: text-2
+            label: Nachname
+            properties:
+              fluidAdditionalAttributes:
+                placeholder: Nachname
+                required: required
+              gridColumnClassAutoConfiguration:
+                viewPorts:
+                  xs:
+                    numbersOfColumnsToUse: '12'
+            validators:
+              -
+                identifier: NotEmpty
+      -
+        type: GridRow
+        identifier: gridrow-2
+        label: 'Grid: Row'
+        renderables:
+          -
+            defaultValue: ''
+            type: Email
+            identifier: email-1
+            label: E-mail
+            properties:
+              fluidAdditionalAttributes:
+                placeholder: vorname.nachname@domain.com
+                required: required
+              gridColumnClassAutoConfiguration:
+                viewPorts:
+                  xs:
+                    numbersOfColumnsToUse: '12'
+            validators:
+              -
+                identifier: EmailAddress
+              -
+                identifier: NotEmpty
+          -
+            defaultValue: ''
+            type: Text
+            identifier: text-3
+            label: Firma
+            properties:
+              fluidAdditionalAttributes:
+                placeholder: Firma
+              gridColumnClassAutoConfiguration:
+                viewPorts:
+                  xs:
+                    numbersOfColumnsToUse: '12'
+      -
+        type: Checkbox
+        identifier: checkbox-1
+        label: 'Ich möchte den Newsletter per E-Mail erhalten. Meine Daten werden keinesfalls an Dritte weitergegeben. Meine Einwilligung kann ich jederzeit durch eine E-Mail an newsletter@cloonar.dev widerrufen. Selbstverständlich können Sie über die gespeicherten Daten Auskunft verlangen.'
+        properties:
+          fluidAdditionalAttributes:
+            required: required
+        validators:
+          -
+            identifier: NotEmpty
--- a/packages/base-design/Resources/Private/Language/locallang_ttc.xlf
+++ b/packages/base-design/Resources/Private/Language/locallang_ttc.xlf
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
+	<file source-language="en" datatype="plaintext" original="EXT:base_design/Resources/Private/Language/locallang_ttc.xlf" date="2011-10-17T20:22:32Z" product-name="cms">
+		<header/>
+		<body>
+			<trans-unit id="space_class_zero" resname="space_class_zero">
+				<source>None</source>
+			</trans-unit>
+    </body>
+  </file>
+</xliff>
--- a/packages/base-design/Resources/Private/Partials/ContentElements/Media/Gallery.html
+++ b/packages/base-design/Resources/Private/Partials/ContentElements/Media/Gallery.html
@@ -0,0 +1,20 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
+  xmlns:bk2k="http://typo3.org/ns/BK2K/BootstrapPackage/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:if condition="{files}">
+
+  <f:variable name="imagecols">{data.imagecols as integer}</f:variable>
+  <f:variable name="columnConfig">{settings.gallery.columns.{imagecols}}</f:variable>
+  <bk2k:data.imageVariants as="variants" variants="{variants}" multiplier="{columnConfig.multiplier}"
+    gutters="{columnConfig.gutters}" corrections="{columnConfig.corrections}" />
+
+  <div class="gallery-row">
+    <f:for each="{files}" as="file" iteration="fileIteration">
+      <div class="gallery-item {columnConfig.class}">
+        <f:render partial="Media/Type" arguments="{file: file, data: data, settings: settings, variants: variants}" />
+      </div>
+    </f:for>
+  </div>
+
+</f:if>
+
+</html>
--- a/packages/base-design/Resources/Private/Partials/ContentElements/Media/Type/Image.html
+++ b/packages/base-design/Resources/Private/Partials/ContentElements/Media/Type/Image.html
@@ -0,0 +1,39 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
+  xmlns:bk2k="http://typo3.org/ns/BK2K/BootstrapPackage/ViewHelpers" data-namespace-typo3-fluid="true">
+<figure class="image">
+  <f:if condition="{file.properties.link}">
+    <f:then>
+      <f:link.typolink parameter="{file.properties.link}" title="{file.properties.title}">
+        <f:render partial="Media/Rendering/Image"
+          arguments="{file: file, data: data, settings: settings, variants: variants}" />
+        <f:if condition="{file.properties.title}">
+          <h4><f:format.nl2br>{file.properties.title}</f:format.nl2br></h4>
+        </f:if>
+      </f:link.typolink>
+    </f:then>
+    <f:else>
+      <f:if condition="{data.image_zoom}">
+        <f:then>
+          <bk2k:link.lightbox image="{file}" maxHeight="{settings.lightbox.image.maxHeight}"
+            maxWidth="{settings.lightbox.image.maxWidth}" class="{settings.lightbox.cssClass}"
+            rel="{settings.lightbox.prefix}-{data.uid}" title="{file.properties.title}"
+            caption="{file.properties.description}">
+            <f:render partial="Media/Rendering/Image"
+              arguments="{file: file, data: data, settings: settings, variants: variants}" />
+          </bk2k:link.lightbox>
+        </f:then>
+        <f:else>
+          <f:render partial="Media/Rendering/Image"
+            arguments="{file: file, data: data, settings: settings, variants: variants}" />
+        </f:else>
+      </f:if>
+    </f:else>
+  </f:if>
+  <f:if condition="{file.properties.description} && !{data.image_zoom}">
+    <figcaption class="caption">
+      <f:format.nl2br>{file.properties.description}</f:format.nl2br>
+    </figcaption>
+  </f:if>
+</figure>
+
+</html>
--- a/packages/base-design/Resources/Private/Partials/News/Detail/MediaImage.html
+++ b/packages/base-design/Resources/Private/Partials/News/Detail/MediaImage.html
@@ -0,0 +1,31 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
+	  xmlns:n="http://typo3.org/ns/GeorgRinger/News/ViewHelpers"
+	  data-namespace-typo3-fluid="true">
+
+<div class="mediaelement mediaelement-image">
+	<f:if condition="{mediaElement.link}">
+		<f:then>
+			<f:link.typolink parameter="{mediaElement.link}" target="{n:targetLink(link:mediaElement.link)}">
+				<f:image image="{mediaElement}" title="{mediaElement.title}" alt="{mediaElement.alternative}" loading="{settings.detail.media.image.lazyLoading}" maxWidth="{f:if(condition: settings.media.maxWidth, then: settings.media.maxWidth, else: settings.detail.media.image.maxWidth)}" maxHeight="{f:if(condition: settings.media.maxHeight, then: settings.media.maxHeight, else: settings.detail.media.image.maxHeight)}" additionalAttributes="{itemprop:'image'}" />
+			</f:link.typolink>
+		</f:then>
+		<f:else>
+			<f:if condition="{settings.detail.media.image.lightbox.enabled}">
+				<f:then>
+					<a href="{f:uri.image(image:mediaElement, width:'{settings.detail.media.image.lightbox.width}m', height:'{settings.detail.media.image.lightbox.height}m')}" title="{mediaElement.title}" class="{settings.detail.media.image.lightbox.class}" rel="{settings.detail.media.image.lightbox.rel}" data-lightbox-width="{settings.detail.media.image.lightbox.width}" data-lightbox-height="{settings.detail.media.image.lightbox.height}" data-lightbox-caption="">
+						<f:image image="{mediaElement}" title="{mediaElement.title}" alt="{mediaElement.alternative}" loading="{settings.detail.media.image.lazyLoading}" maxWidth="{f:if(condition: settings.media.maxWidth, then: settings.media.maxWidth, else: settings.detail.media.image.maxWidth)}" maxHeight="{f:if(condition: settings.media.maxHeight, then: settings.media.maxHeight, else: settings.detail.media.image.maxHeight)}" additionalAttributes="{itemprop:'image'}" />
+					</a>
+				</f:then>
+				<f:else>
+					<f:image image="{mediaElement}" title="{mediaElement.title}" alt="{mediaElement.alternative}" loading="{settings.detail.media.image.lazyLoading}" maxWidth="{f:if(condition: settings.media.maxWidth, then: settings.media.maxWidth, else: settings.detail.media.image.maxWidth)}" maxHeight="{f:if(condition: settings.media.maxHeight, then: settings.media.maxHeight, else: settings.detail.media.image.maxHeight)}" additionalAttributes="{itemprop:'image'}" />
+				</f:else>
+			</f:if>
+		</f:else>
+	</f:if>
+</div>
+<f:if condition="{mediaElement.description}">
+	<p class="news-img-caption">
+		{mediaElement.description}
+	</p>
+</f:if>
+</html>
--- a/packages/base-design/Resources/Private/Partials/News/Detail/Opengraph.html
+++ b/packages/base-design/Resources/Private/Partials/News/Detail/Opengraph.html
@@ -0,0 +1,40 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
+	  xmlns:n="http://typo3.org/ns/GeorgRinger/News/ViewHelpers"
+	  data-namespace-typo3-fluid="true">
+
+<f:if condition="{newsItem.alternativeTitle}">
+	<f:then><n:metaTag property="og:title" content="{newsItem.alternativeTitle}" /></f:then>
+	<f:else><n:metaTag property="og:title" content="{newsItem.title}" /></f:else>
+</f:if>
+<n:metaTag property="og:type" content="{settings.opengraph.type}" />
+<n:metaTag property="og:url" content="" useCurrentDomain="1" />
+<n:metaTag property="og:site_name" content="{settings.opengraph.site_name}" />
+<f:if condition="{newsItem.media.0}">
+    <f:variable name="ogImagePath" value="{f:uri.image(src:'{newsItem.media.0.uid}', treatIdAsReference:1, maxWidth:'1200')}" />
+	<n:metaTag
+		property="og:image"
+		content="{ogImagePath}"
+		forceAbsoluteUrl="1" />
+	<n:metaTag property="og:image:width" content="{n:imageSize(property:'width', image:'{ogImagePath}')}" />
+	<n:metaTag property="og:image:height" content="{n:imageSize(property:'height', image:'{ogImagePath}')}" />
+</f:if>
+
+<f:if condition="{newsItem.description}">
+	<f:then>
+		<n:metaTag name="description" content="{newsItem.description}" />
+		<n:metaTag property="og:description" content="{newsItem.description}" />
+	</f:then>
+	<f:else>
+		<n:metaTag name="description" content="{newsItem.teaser -> f:format.stripTags()}" />
+		<n:metaTag property="og:description" content="{newsItem.teaser -> f:format.stripTags()}" />
+	</f:else>
+</f:if>
+<n:metaTag name="keywords" content="{newsItem.keywords}" />
+<n:metaTag property="fb:admins" content="{settings.opengraph.admins}" />
+<n:metaTag property="og:locale" content="{settings.opengraph.locale}" />
+<f:if condition="{settings.opengraph.twitter.site}">
+	<n:metaTag name="twitter:card" content="{settings.opengraph.twitter.card}" />
+	<n:metaTag name="twitter:site" content="{settings.opengraph.twitter.site}" />
+	<n:metaTag name="twitter:creator" content="{settings.opengraph.twitter.creator}" />
+</f:if>
+</html>
--- a/packages/base-design/Resources/Private/Partials/News/List/Item.html
+++ b/packages/base-design/Resources/Private/Partials/News/List/Item.html
@@ -0,0 +1,103 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
+	  xmlns:n="http://typo3.org/ns/GeorgRinger/News/ViewHelpers"
+	  data-namespace-typo3-fluid="true">
+<!--
+	=====================
+		Partials/List/Item.html
+-->
+<div class="article articletype-{newsItem.type}{f:if(condition: newsItem.istopnews, then: ' topnews')}" itemscope="itemscope" itemtype="https://schema.org/Article">
+	<n:excludeDisplayedNews newsItem="{newsItem}"/>
+	<!-- header -->
+	<div class="header">
+		<h3>
+			<n:link newsItem="{newsItem}" settings="{settings}" title="{newsItem.title}" additionalAttributes="{itemprop:'url'}">
+				<span itemprop="headline">{newsItem.title}</span>
+			</n:link>
+		</h3>
+	</div>
+
+	<f:if condition="{newsItem.media}">
+		<!-- media preview element -->
+		<f:then>
+			<div class="news-img-wrap">
+				<n:link newsItem="{newsItem}" settings="{settings}" title="{newsItem.title}">
+					<f:alias map="{mediaElement: newsItem.media.0}">
+						<f:if condition="{mediaElement.originalResource.type} == 2">
+							<f:image image="{mediaElement}" title="{mediaElement.originalResource.title}" alt="{mediaElement.originalResource.alternative}" loading="{settings.list.media.image.lazyLoading}" width="{f:if(condition: settings.media.maxWidth, then: settings.media.maxWidth, else: settings.list.media.image.maxWidth)}" height="{f:if(condition: settings.media.maxHeight, then: settings.media.maxHeight, else: settings.list.media.image.maxHeight)}"/>
+						</f:if>
+						<f:if condition="{mediaElement.originalResource.type} == 4">
+							<f:render partial="Detail/MediaVideo" arguments="{mediaElement: mediaElement}"/>
+						</f:if>
+						<f:if condition="{mediaElement.originalResource.type} == 5">
+							<f:image image="{mediaElement}" title="{mediaElement.originalResource.title}" alt="{mediaElement.originalResource.alternative}" loading="{settings.list.media.image.lazyLoading}" width="{f:if(condition: settings.media.maxWidth, then: settings.media.maxWidth, else: settings.list.media.image.maxWidth)}" height="{f:if(condition: settings.media.maxHeight, then: settings.media.maxHeight, else: settings.list.media.image.maxHeight)}"/>
+						</f:if>
+					</f:alias>
+				</n:link>
+			</div>
+		</f:then>
+		<f:else>
+			<f:if condition="{settings.displayDummyIfNoMedia}">
+				<div class="news-img-wrap">
+					<span class="no-media-element">
+						<n:link newsItem="{newsItem}" settings="{settings}" title="{newsItem.title}">
+							<f:image src="{settings.list.media.dummyImage}" title="" alt="" loading="{settings.list.media.image.lazyLoading}" maxWidth="{f:if(condition: settings.media.maxWidth, then: settings.media.maxWidth, else: settings.list.media.image.maxWidth)}" maxHeight="{f:if(condition: settings.media.maxHeight, then: settings.media.maxHeight, else: settings.list.media.image.maxHeight)}"/>
+						</n:link>
+					</span>
+				</div>
+			</f:if>
+		</f:else>
+	</f:if>
+
+
+	<!-- teaser -->
+	<div class="teaser-text">
+		<n:removeMediaTags>
+		<f:if condition="{newsItem.teaser}">
+			<f:then>
+				<div itemprop="description">{newsItem.teaser -> f:format.crop(maxCharacters: '{settings.cropMaxCharacters}', respectWordBoundaries:'1') -> f:format.raw()}</div>
+			</f:then>
+			<f:else>
+				<div itemprop="description">{newsItem.bodytext -> f:format.crop(maxCharacters: '{settings.cropMaxCharacters}', respectWordBoundaries:'1') -> f:format.raw()}</div>
+			</f:else>
+		</f:if>
+		</n:removeMediaTags>
+
+		<n:link newsItem="{newsItem}" settings="{settings}" class="more" title="{newsItem.title}">
+			<f:translate key="more-link"/>
+		</n:link>
+	</div>
+
+	<!-- footer information -->
+	<div class="footer">
+		<p>
+			<!-- date -->
+			<span class="news-list-date">
+				<time itemprop="datePublished" datetime="{f:format.date(date:newsItem.datetime, format:'Y-m-d')}">
+					<f:format.date format="{f:translate(key:'dateFormat')}">{newsItem.datetime}</f:format.date>
+				</time>
+			</span>
+
+			<f:if condition="{newsItem.firstCategory}">
+				<!-- first category -->
+				<span class="news-list-category">{newsItem.firstCategory.title}</span>
+			</f:if>
+
+			<f:if condition="{newsItem.tags}">
+				<!-- Tags -->
+				<span class="news-list-tags" itemprop="keywords">
+					<f:for each="{newsItem.tags}" as="tag">
+						{tag.title}
+					</f:for>
+				</span>
+			</f:if>
+
+			<!-- author -->
+			<f:if condition="{newsItem.author}">
+				<span class="news-list-author">
+					<f:translate key="author" arguments="{0:newsItem.author}"/>
+				</span>
+			</f:if>
+		</p>
+	</div>
+</div>
+</html>
--- a/packages/base-design/Resources/Private/Partials/News/List/Pagination.html
+++ b/packages/base-design/Resources/Private/Partials/News/List/Pagination.html
@@ -0,0 +1,57 @@
+<ul class="f3-widget-paginator">
+    <f:if condition="{pagination.previousPageNumber} && {pagination.previousPageNumber} >= {pagination.firstPageNumber}">
+        <f:then>
+            <f:comment>
+                <li class="first">
+                    <a href="{f:uri.action(action:actionName, arguments:{currentPage: 1},addQueryString:1)}" title="{f:translate(key:'pagination.first')}">
+                        <i class="material-icons">first_page</i>
+                    </a>
+                </li>
+            </f:comment>
+            <li class="previous">
+                <a href="{f:uri.action(action:actionName, arguments:{currentPage: pagination.previousPageNumber},addQueryString:1)}" title="{f:translate(key:'pagination.previous')}">
+                    {f:translate(key:'widget.pagination.previous', extensionName: 'fluid')}
+                </a>
+            </li>
+        </f:then>
+        <f:else>
+            <f:comment>
+                <li class="disabled"><span><i class="material-icons">first_page</i></span></li>
+                <li class="disabled"><span>{f:translate(key:'widget.pagination.previous', extensionName: 'fluid')}</span></li>
+            </f:comment>
+        </f:else>
+    </f:if>
+    <f:if condition="{pagination.hasLessPages}">
+      <li><span>…</span></li>
+    </f:if>
+    <f:for each="{pagination.allPageNumbers}" as="page">
+        <li class="{f:if(condition: '{page} == {paginator.currentPageNumber}', then:'current')}">
+            <a href="{f:uri.action(action:actionName, arguments:{currentPage: page},addQueryString:1)}">{page}</a>
+        </li>
+    </f:for>
+    <f:if condition="{pagination.hasMorePages}">
+      <li><span>…</span></li>
+    </f:if>
+    <f:if condition="{pagination.nextPageNumber} && {pagination.nextPageNumber} <= {pagination.lastPageNumber}">
+        <f:then>
+            <li class="next">
+                <a href="{f:uri.action(action:actionName, arguments:{currentPage: pagination.nextPageNumber},addQueryString:1)}" title="{f:translate(key:'pagination.next')}">
+                    {f:translate(key:'widget.pagination.next', extensionName: 'fluid')}
+                </a>
+            </li>
+            <f:comment>
+                <li class="last">
+                    <a href="{f:uri.action(action:actionName, arguments:{currentPage: pagination.lastPageNumber},addQueryString:1)}" title="{f:translate(key:'pagination.last')}">
+                        last
+                    </a>
+                </li>
+            </f:comment>
+        </f:then>
+        <f:else>
+            <f:comment>
+                <li class="disabled"><span>{f:translate(key:'widget.pagination.next', extensionName: 'fluid')}</span></li>
+                <li class="disabled"><span>last page</span></li>
+            </f:comment>
+        </f:else>
+    </f:if>
+</ul>
--- a/packages/base-design/Resources/Private/Partials/News/List/ZahlItem.html
+++ b/packages/base-design/Resources/Private/Partials/News/List/ZahlItem.html
@@ -0,0 +1,86 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
+	  xmlns:n="http://typo3.org/ns/GeorgRinger/News/ViewHelpers"
+	  data-namespace-typo3-fluid="true">
+<!--
+	=====================
+		Partials/List/Item.html
+-->
+<div class="article articletype-{newsItem.type}{f:if(condition: newsItem.istopnews, then: ' topnews')}" itemscope="itemscope" itemtype="https://schema.org/Article">
+	<n:excludeDisplayedNews newsItem="{newsItem}"/>
+	<!-- header -->
+	<div class="header">
+		<h3>
+      <span itemprop="headline">{newsItem.title}</span>
+		</h3>
+	</div>
+
+	<f:if condition="{newsItem.media}">
+		<!-- media preview element -->
+		<f:then>
+			<div class="news-img-wrap">
+        <f:alias map="{mediaElement: newsItem.media.0}">
+          <f:if condition="{mediaElement.originalResource.type} == 2">
+            <f:image image="{mediaElement}" title="{mediaElement.originalResource.title}" alt="{mediaElement.originalResource.alternative}" loading="{settings.list.media.image.lazyLoading}" width="{f:if(condition: settings.media.maxWidth, then: settings.media.maxWidth, else: settings.list.media.image.maxWidth)}" height="{f:if(condition: settings.media.maxHeight, then: settings.media.maxHeight, else: settings.list.media.image.maxHeight)}"/>
+          </f:if>
+          <f:if condition="{mediaElement.originalResource.type} == 4">
+            <f:render partial="Detail/MediaVideo" arguments="{mediaElement: mediaElement}"/>
+          </f:if>
+          <f:if condition="{mediaElement.originalResource.type} == 5">
+            <f:image image="{mediaElement}" title="{mediaElement.originalResource.title}" alt="{mediaElement.originalResource.alternative}" loading="{settings.list.media.image.lazyLoading}" width="{f:if(condition: settings.media.maxWidth, then: settings.media.maxWidth, else: settings.list.media.image.maxWidth)}" height="{f:if(condition: settings.media.maxHeight, then: settings.media.maxHeight, else: settings.list.media.image.maxHeight)}"/>
+          </f:if>
+        </f:alias>
+			</div>
+		</f:then>
+		<f:else>
+			<f:if condition="{settings.displayDummyIfNoMedia}">
+				<div class="news-img-wrap">
+					<span class="no-media-element">
+            <f:image src="{settings.list.media.dummyImage}" title="" alt="" loading="{settings.list.media.image.lazyLoading}" maxWidth="{f:if(condition: settings.media.maxWidth, then: settings.media.maxWidth, else: settings.list.media.image.maxWidth)}" maxHeight="{f:if(condition: settings.media.maxHeight, then: settings.media.maxHeight, else: settings.list.media.image.maxHeight)}"/>
+					</span>
+				</div>
+			</f:if>
+		</f:else>
+	</f:if>
+
+
+	<!-- teaser -->
+	<div class="teaser-text">
+		<n:removeMediaTags>
+        <div itemprop="description">{newsItem.bodytext -> f:format.html()}</div>
+		</n:removeMediaTags>
+	</div>
+
+	<!-- footer information -->
+	<div class="footer">
+		<p>
+			<!-- date -->
+			<span class="news-list-date">
+				<time itemprop="datePublished" datetime="{f:format.date(date:newsItem.datetime, format:'Y-m-d')}">
+					<f:format.date format="{f:translate(key:'dateFormat')}">{newsItem.datetime}</f:format.date>
+				</time>
+			</span>
+
+			<f:if condition="{newsItem.firstCategory}">
+				<!-- first category -->
+				<span class="news-list-category">{newsItem.firstCategory.title}</span>
+			</f:if>
+
+			<f:if condition="{newsItem.tags}">
+				<!-- Tags -->
+				<span class="news-list-tags" itemprop="keywords">
+					<f:for each="{newsItem.tags}" as="tag">
+						{tag.title}
+					</f:for>
+				</span>
+			</f:if>
+
+			<!-- author -->
+			<f:if condition="{newsItem.author}">
+				<span class="news-list-author">
+					<f:translate key="author" arguments="{0:newsItem.author}"/>
+				</span>
+			</f:if>
+		</p>
+	</div>
+</div>
+</html>
--- a/packages/base-design/Resources/Private/Partials/Page/DropIn/Navigation/MainAfter.html
+++ b/packages/base-design/Resources/Private/Partials/Page/DropIn/Navigation/MainAfter.html
@@ -0,0 +1,19 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:bk2k="http://typo3.org/ns/BK2K/BootstrapPackage/ViewHelpers" data-namespace-typo3-fluid="true">
+<div class="search-wrap">
+  <form 
+    method="get" 
+    id="form_kesearch_searchfield" 
+    name="form_kesearch_searchfield" 
+    action="{f:uri.typolink(parameter: settings.pageIds.search)}"
+    class="search-wrap"
+  >
+    <div class="input-group">
+      <input type="text" id="header-search-input" name="tx_kesearch_pi1[sword]" class="form-control" />
+     <div class="input-group-append">
+       <button class="btn btn-primary" type="submit">
+        <bk2k:inlineSvg src="EXT:bootstrap_package/Resources/Public/Images/Icons/Glyphicons/search.svg" height="20" width="20" />
+       </button>
+     </div>
+   </div>
+  </form>
+</div>
--- a/packages/base-design/Resources/Private/Partials/Search/ResultRow.html
+++ b/packages/base-design/Resources/Private/Partials/Search/ResultRow.html
@@ -0,0 +1,74 @@
+<f:comment>
+  <!--
+	=====================
+	Base Partials/Search/ResultRow.html
+-->
+</f:comment>
+
+<div class="result-list-item result-list-item-type-{resultrow.type}">
+  <span class="clearer">&nbsp;</span>
+  <div class="add-info">
+    <f:if condition="{conf.showResultUrl}">
+      <i>{f:translate(key: 'LLL:EXT:ke_search/Resources/Private/Language/locallang_searchbox.xlf:label_resulturl')}:</i>
+      <f:format.raw>{resultrow.url}</f:format.raw><br />
+    </f:if>
+
+    <f:if condition="{conf.showTags}">
+      <i>{f:translate(key: 'LLL:EXT:ke_search/Resources/Private/Language/locallang_searchbox.xlf:label_tags')}:</i>
+      {resultrow.tags}<br />
+    </f:if>
+  </div>
+  <span class="teaser_icon">
+    <a href="{resultrow.url}">
+      <f:render section="typeIconOrPreviewImage"
+        arguments="{icon: resultrow.typeIconPath, filePreviewId: resultrow.filePreviewId, treatIdAsReference:resultrow.treatIdAsReference, iconConf: conf.showTypeIcon}" />
+    </a>
+  </span>
+  <h3 class="result-title">
+    <f:if condition="{conf.resultsNumeration}">
+      <span class="result-number">{resultrow.number}.</span>
+    </f:if>
+    <f:format.raw>
+      <f:format.crop maxCharacters="65" append="...">
+        {resultrow.title}
+      </f:format.crop>
+    </f:format.raw>
+  </h3>
+  <f:if condition="{resultrow.type} == 'cal'">
+    <f:then>
+      <f:comment>
+        <!-- Special cal date rendering -->
+      </f:comment>
+      <f:render partial="CalDate" arguments="{resultrow: resultrow}" />
+      <br />
+    </f:then>
+    <f:else>
+      <f:comment>
+        <!-- Default date rendering -->
+      </f:comment>
+      <f:if condition="{conf.showDate}">
+        <div class="result-date">
+          <!-- <f:format.date>{resultrow.date_timestamp}</f:format.date> -->
+          01.01.2023
+        </div>
+      </f:if>
+    </f:else>
+  </f:if>
+  <div class="result-teaser">
+    <f:format.raw>{resultrow.teaser}</f:format.raw>
+  </div>
+  <span class="clearer">&nbsp;</span>
+</div>
+
+
+<f:section name="typeIconOrPreviewImage">
+  <f:if condition="{iconConf} && !{filePreviewId}">
+    <f:then>
+    </f:then>
+    <f:else>
+      <f:if condition="{filePreviewId}">
+        <f:image src="{filePreviewId}" treatIdAsReference="{treatIdAsReference}" width="100m" height="100c" />
+      </f:if>
+    </f:else>
+  </f:if>
+</f:section>
--- a/packages/base-design/Resources/Private/Partials/Search/ResultRows.html
+++ b/packages/base-design/Resources/Private/Partials/Search/ResultRows.html
@@ -0,0 +1,29 @@
+<f:comment>
+  <!--
+	=====================
+	Partials/ResultRows.html
+-->
+</f:comment>
+
+<div class="clearer"> </div>
+<f:render partial="Sorting" arguments="{conf: conf, numberofresults: numberofresults, sortingLinks: sortingLinks}" />
+<f:if condition="{conf.pagebrowserOnTop}">
+  <div id="kesearch_pagebrowser_top">
+    <f:render partial="PageBrowser"
+      arguments="{conf: conf, numberofresults:numberofresults, pagebrowser:pagebrowser}" />
+  </div>
+</f:if>
+<div id="kesearch_results">
+  <f:for each="{resultrows}" as="resultrow">
+    <f:render partial="ResultRow" arguments="{conf: conf, resultrow: resultrow}" />
+  </f:for>
+</div>
+<f:if condition="{conf.pagebrowserAtBottom}">
+  <div id="kesearch_pagebrowser_bottom">
+    <f:render partial="PageBrowser"
+      arguments="{conf: conf, numberofresults:numberofresults, pagination:pagination}" />
+  </div>
+</f:if>
+<f:if condition="{conf.showQueryTime}">
+  <div id="kesearch_query_time">{queryTimeText}</div>
+</f:if>
--- a/packages/base-design/Resources/Private/Partials/Structure/FooterContent.html
+++ b/packages/base-design/Resources/Private/Partials/Structure/FooterContent.html
@@ -0,0 +1,17 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<section class="section footer-section footer-section-content">
+    <div class="container">
+        <div class="section-row">
+            <div class="section-column footer-section-content-column footer-section-content-column-left">
+                <f:cObject typoscriptObjectPath="lib.dynamicContent" data="{pageUid: '{data.uid}', colPos: '10', slide: '-1'}" />
+            </div>
+            <div class="section-column footer-section-content-column footer-section-content-column-middle">
+                <f:cObject typoscriptObjectPath="lib.dynamicContent" data="{pageUid: '{data.uid}', colPos: '11', slide: '-1'}" />
+            </div>
+            <div class="section-column footer-section-content-column footer-section-content-column-right">
+                <f:cObject typoscriptObjectPath="lib.dynamicContent" data="{pageUid: '{data.uid}', colPos: '12', slide: '-1'}" />
+            </div>
+        </div>
+    </div>
+</section>
+</html>
--- a/packages/base-design/Resources/Private/Templates/News/News/Detail.html
+++ b/packages/base-design/Resources/Private/Templates/News/News/Detail.html
@@ -0,0 +1,203 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
+	  xmlns:n="http://typo3.org/ns/GeorgRinger/News/ViewHelpers"
+	  xmlns:rx="http://typo3.org/ns/Reelworx/RxShariff/ViewHelper"
+	  data-namespace-typo3-fluid="true">
+
+<f:layout name="Detail" />
+
+<!--
+	=====================
+		News/Detail.html
+-->
+
+<f:section name="content">
+	<f:if condition="{newsItem}">
+		<f:then>
+			<n:format.nothing>
+				<n:excludeDisplayedNews newsItem="{newsItem}" />
+				<f:if condition="{settings.detail.showMetaTags}">
+					<f:render partial="Detail/Opengraph" arguments="{newsItem: newsItem, settings:settings}" />
+				</f:if>
+                <f:if condition="{newsItem.alternativeTitle}">
+                    <f:then>
+                        <n:titleTag>
+                            <f:format.htmlentitiesDecode>{newsItem.alternativeTitle}</f:format.htmlentitiesDecode>
+                        </n:titleTag>
+                    </f:then>
+                    <f:else>
+                        <n:titleTag>
+                            <f:format.htmlentitiesDecode>{newsItem.title}</f:format.htmlentitiesDecode>
+                        </n:titleTag>
+                    </f:else>
+                </f:if>
+			</n:format.nothing>
+			<f:if condition="{settings.detail.showPrevNext}">
+				<n:simplePrevNext pidList="{newsItem.pid}" news="{newsItem}" as="paginated" sortField="datetime">
+					<f:if condition="{paginated}">
+						<ul class="pager">
+							<f:if condition="{paginated.prev}">
+								<li class="previous">
+									<n:link newsItem="{paginated.prev}" settings="{settings}">
+										<span aria-hidden="true">&larr; </span>{paginated.prev.title}
+									</n:link>
+								</li>
+							</f:if>
+							<f:if condition="{paginated.next}">
+								<li class="next">
+									<n:link newsItem="{paginated.next}" settings="{settings}" class="next">
+										{paginated.next.title} <span aria-hidden="true"> &rarr;</span>
+									</n:link>
+								</li>
+							</f:if>
+						</ul>
+					</f:if>
+				</n:simplePrevNext>
+			</f:if>
+			<div class="header">
+				<h1 itemprop="headline">{newsItem.title}</h1>
+			</div>
+			<div class="footer">
+				<p>
+					<!-- date -->
+					<span class="news-list-date">
+						<time itemprop="datePublished" datetime="{f:format.date(date:newsItem.datetime, format:'Y-m-d')}">
+							<f:format.date format="{f:translate(key:'dateFormat')}">{newsItem.datetime}</f:format.date>
+						</time>
+					</span>
+
+					<f:if condition="{newsItem.categories}">
+						<f:render partial="Category/Items" arguments="{categories:newsItem.categories, settings:settings}" />
+					</f:if>
+
+					<f:if condition="{newsItem.tags}">
+						<!-- Tags -->
+						<span class="news-list-tags" itemprop="keywords">
+						<f:for each="{newsItem.tags}" as="tag">
+							{tag.title}
+						</f:for>
+						</span>
+					</f:if>
+
+					<f:if condition="{newsItem.author}">
+						<!-- author -->
+						<span class="news-list-author" itemprop="author" itemscope="itemscope" itemtype="http://schema.org/Person">
+							<f:translate key="author_simple" /> <span itemprop="name">{newsItem.author}</span>
+						</span>
+					</f:if>
+				</p>
+			</div>
+			<n:renderMedia news="{newsItem}" imgClass="img-responsive" videoClass="video-wrapper" audioClass="audio-wrapper">
+				<f:if condition="{newsItem.contentElements}">
+					<!-- content elements -->
+					<f:cObject typoscriptObjectPath="lib.tx_news.contentElementRendering">{newsItem.contentElementIdList}</f:cObject>
+				</f:if>
+
+        <f:if condition="{newsItem.falMedia -> f:count()} > 1">
+          <f:render partial="Detail/MediaContainer" arguments="{media: newsItem.mediaNonPreviews, settings:settings}" />
+        </f:if>
+
+				<!-- main text -->
+				<div class="news-text-wrap" itemprop="articleBody">
+					<f:format.html>{newsItem.bodytext}</f:format.html>
+				</div>
+			</n:renderMedia>
+
+			<f:if condition="{settings.backPid}">
+				<!-- Link Back -->
+				<div class="news-backlink-wrap">
+					<f:link.page pageUid="{settings.backPid}">
+						<f:translate key="back-link" />
+					</f:link.page>
+				</div>
+			</f:if>
+
+			<f:if condition="{settings.detail.showSocialShareButtons}">
+				<f:comment>
+					Care about the privacy of your readers?
+					Checkout https://typo3.org/extensions/repository/view/rx_shariff
+					and it will be used automatically!
+				</f:comment>
+				<n:extensionLoaded extensionKey="rx_shariff">
+					<f:render partial="Detail/Shariff" />
+				</n:extensionLoaded>
+			</f:if>
+
+			<!-- related things -->
+			<div class="news-related-wrap">
+				<f:comment>
+					Various options exist to fetch different related information:
+					- {newsItem.allRelatedSorted}: all related news, related und related from, sorted by date
+					- {newsItem.related}: all related
+					- {newsItem.relatedSorted}: all related, sorted by date
+					- {newsItem.relatedFrom}: all related from
+					- {newsItem.relatedFromSortedByForeign}: all related from sorted by foreign sorting
+					- {newsItem.relatedFromSorted}: all related from, sorted by date
+				</f:comment>
+
+				<f:if condition="{newsItem.allRelatedSorted}">
+					<!-- Related news records -->
+					<div class="news-related news-related-news">
+						<h4>
+							<f:translate key="related-news" />
+						</h4>
+						<ul>
+							<f:for each="{newsItem.allRelatedSorted}" as="related">
+								<li>
+									<span class="news-related-news-date"><f:format.date format="{f:translate(key:'dateFormat')}">{related.datetime}</f:format.date></span>
+									<n:link newsItem="{related}" settings="{settings}" title="{related.title}">
+										{related.title}
+									</n:link>
+								</li>
+
+							</f:for>
+						</ul>
+					</div>
+				</f:if>
+
+				<f:if condition="{newsItem.relatedFiles}">
+					<!-- related files -->
+					<div class="news-related news-related-files">
+						<h4>
+							<f:translate key="related-files" />
+						</h4>
+						<ul>
+							<f:for each="{newsItem.relatedFiles}" as="relatedFile">
+								<li>
+									<span class="news-related-files-link">
+										<a href="{relatedFile.originalResource.publicUrl -> f:format.htmlspecialchars()}" target="_blank">
+											{f:if(condition:relatedFile.originalResource.title, then:relatedFile.originalResource.title, else:relatedFile.originalResource.name)}
+										</a>
+									</span>
+									<span class="news-related-files-size">
+										{relatedFile.originalResource.size -> f:format.bytes()}
+									</span>
+								</li>
+							</f:for>
+						</ul>
+					</div>
+				</f:if>
+
+				<f:if condition="{newsItem.relatedLinks}">
+					<!-- Related links -->
+					<div class="news-related news-related-links">
+						<h4>
+							<f:translate key="related-links" />
+						</h4>
+						<ul>
+							<f:for each="{newsItem.relatedLinks}" as="relatedLink">
+								<li>
+									<f:link.typolink parameter="{relatedLink.uri}" title="{relatedLink.title}" target="{n:targetLink(link:relatedLink.uri)}">{f:if(condition: relatedLink.title, then: relatedLink.title, else: relatedLink.uri)}</f:link.typolink>
+									<f:if condition="{relatedLink.description}"><span>{relatedLink.description}</span></f:if>
+								</li>
+							</f:for>
+						</ul>
+					</div>
+				</f:if>
+			</div>
+		</f:then>
+		<f:else>
+
+		</f:else>
+	</f:if>
+</f:section>
+</html>
--- a/packages/base-design/Resources/Private/Templates/News/News/List.html
+++ b/packages/base-design/Resources/Private/Templates/News/News/List.html
@@ -0,0 +1,52 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
+	  xmlns:n="http://typo3.org/ns/GeorgRinger/News/ViewHelpers"
+	  data-namespace-typo3-fluid="true">
+<f:layout name="General" />
+<!--
+	=====================
+		Templates/News/List.html
+-->
+
+<f:section name="content">
+	<!--TYPO3SEARCH_end-->
+	<f:if condition="{news}">
+		<f:then>
+      <div class="news-list-view news-list-{settings.templateLayout}" id="news-container-{contentObjectData.uid}">
+				<f:if condition="{settings.hidePagination}">
+					<f:then>
+						<f:for each="{news}" as="newsItem" iteration="iterator">
+							<f:render partial="List/Item" arguments="{newsItem: newsItem,settings:settings,iterator:iterator}" />
+						</f:for>
+					</f:then>
+					<f:else>
+                        <f:if condition="{settings.list.paginate.insertAbove}">
+                            <f:render partial="List/Pagination" arguments="{pagination: pagination.pagination, paginator: pagination.paginator}" />
+                        </f:if>
+                        <f:if condition="{settings.templateLayout} == 1">
+                          <f:then>
+                            <f:for each="{pagination.paginator.paginatedItems}" as="newsItem" iteration="iterator">
+                                <f:render partial="List/ZahlItem" arguments="{newsItem: newsItem,settings:settings,iterator:iterator}" />
+                            </f:for>
+                          </f:then>
+                          <f:else>
+                            <f:for each="{pagination.paginator.paginatedItems}" as="newsItem" iteration="iterator">
+                                <f:render partial="List/Item" arguments="{newsItem: newsItem,settings:settings,iterator:iterator}" />
+                            </f:for>
+                          </f:else>
+                        </f:if>
+                        <f:if condition="{settings.list.paginate.insertBelow}">
+                            <f:render partial="List/Pagination" arguments="{pagination: pagination.pagination, paginator: pagination.paginator}" />
+                        </f:if>
+					</f:else>
+				</f:if>
+			</div>
+		</f:then>
+		<f:else>
+			<div class="no-news-found">
+				<f:translate key="list_nonewsfound" />
+			</div>
+		</f:else>
+	</f:if>
+	<!--TYPO3SEARCH_begin-->
+</f:section>
+</html>
--- a/packages/base-design/Resources/Private/Templates/Page/Default.html
+++ b/packages/base-design/Resources/Private/Templates/Page/Default.html
@@ -0,0 +1,24 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
+<f:layout name="Default" />
+<f:section name="Border">
+
+    <f:cObject typoscriptObjectPath="lib.dynamicContent" data="{pageUid: '{data.uid}', colPos: '3', slide: '{theme.pagelayout.{pagelayout}.colPos.3.slide}'}" />
+
+</f:section>
+<f:section name="Main">
+
+    <f:cObject typoscriptObjectPath="lib.dynamicContent" data="{pageUid: '{data.uid}', colPos: '8', slide: '{theme.pagelayout.{pagelayout}.colPos.8.slide}'}" />
+
+    <div class="section section-default">
+        <f:cObject typoscriptObjectPath="lib.dynamicContent" data="{pageUid: '{data.uid}', colPos: '0', slide: '{theme.pagelayout.{pagelayout}.colPos.0.slide}'}" />
+    </div>
+
+    <f:cObject typoscriptObjectPath="lib.dynamicContent" data="{pageUid: '{data.uid}', colPos: '9', slide: '{theme.pagelayout.{pagelayout}.colPos.9.slide}'}" />
+
+</f:section>
+<f:section name="Footer">
+
+    <f:render partial="Structure/FooterContent" arguments="{_all}" />
+
+</f:section>
+</html>
--- a/packages/base-design/Resources/Private/Templates/Search/SearchForm.html
+++ b/packages/base-design/Resources/Private/Templates/Search/SearchForm.html
@@ -0,0 +1,83 @@
+<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
+  xmlns:kesearch="http://typo3.org/ns/Tpwd/KeSearch/ViewHelpers" data-namespace-typo3-fluid="true">
+
+<f:layout name="General" />
+<f:comment>
+  <!--
+=====================
+Templates/SearchForm.html
+-->
+</f:comment>
+<f:section name="content">
+  <form method="get" id="form_kesearch_pi1" name="form_kesearch_pi1" action="{f:uri.page(pageUid: targetpage)}">
+    <f:comment>
+      <!-- Replace the URL with the speaking URL -->
+    </f:comment>
+    <f:if condition="{isEmptySearch} == FALSE ">
+      <f:if condition="{conf.searchWordParameter} == 'tx_kesearch_pi1[sword]'">
+        <f:format.raw>
+          <script>history.replaceState(null, '', '</f:format.raw><kesearch:link keepPiVars="1" uriOnly="1" /><f:format.raw>');</script>
+        </f:format.raw>
+      </f:if>
+    </f:if>
+
+    <fieldset class="kesearch_searchbox">
+      <f:if condition="{lparam}">
+        <input type="hidden" name="L" value="{lparam}" />
+      </f:if>
+      <f:if condition="{mpparam}">
+        <input type="hidden" name="MP" value="{mpparam}" />
+      </f:if>
+      <f:if condition="{typeparam}">
+        <input type="hidden" name="type" value="{typeparam}" />
+      </f:if>
+
+      <div class="kesearchbox">
+        <div class="inputwrapper">
+          <div class="input">
+            <input type="search" id="ke_search_sword" name="tx_kesearch_pi1[sword]"
+              value="{searchword -> f:format.raw()}" placeholder="{searchwordDefault}"
+              {f:if(condition: '{extConf.allowEmptySearch} == 0' , then: 'required' )}
+              minlength="{extConf.searchWordLength}" />
+          </div>
+
+          <div class="reset hidden"
+            title="{f:translate(key: 'LLL:EXT:ke_search/Resources/Private/Language/locallang_searchbox.xlf:reset_button')}">
+            <svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 512 512">
+              <path
+                d="M437.5 386.6L306.9 256l130.6-130.6c14.1-14.1 14.1-36.8 0-50.9-14.1-14.1-36.8-14.1-50.9 0L256 205.1 125.4 74.5c-14.1-14.1-36.8-14.1-50.9 0-14.1 14.1-14.1 36.8 0 50.9L205.1 256 74.5 386.6c-14.1 14.1-14.1 36.8 0 50.9 14.1 14.1 36.8 14.1 50.9 0L256 306.9l130.6 130.6c14.1 14.1 36.8 14.1 50.9 0 14-14.1 14-36.9 0-50.9z" />
+            </svg>
+            <div class="spacer"></div>
+          </div>
+        </div>
+        <button class="submit" type="submit"
+          title="{f:translate(key: 'LLL:EXT:ke_search/Resources/Private/Language/locallang_searchbox.xlf:submit')}">
+          <svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 512 512">
+            <path
+              d="M344.5 298c15-23.6 23.8-51.6 23.8-81.7 0-84.1-68.1-152.3-152.1-152.3C132.1 64 64 132.2 64 216.3c0 84.1 68.1 152.3 152.1 152.3 30.5 0 58.9-9 82.7-24.4l6.9-4.8L414.3 448l33.7-34.3-108.5-108.6 5-7.1zm-43.1-166.8c22.7 22.7 35.2 52.9 35.2 85s-12.5 62.3-35.2 85c-22.7 22.7-52.9 35.2-85 35.2s-62.3-12.5-85-35.2c-22.7-22.7-35.2-52.9-35.2-85s12.5-62.3 35.2-85c22.7-22.7 52.9-35.2 85-35.2s62.3 12.5 85 35.2z" />
+          </svg>
+        </button>
+
+        <f:if condition="{page}">
+          <input id="kesearchpagenumber" type="hidden" name="tx_kesearch_pi1[page]" value="{page}" />
+        </f:if>
+        <input id="resetFilters" type="hidden" name="tx_kesearch_pi1[resetFilters]" value="0" />
+        <f:if condition="{sortByField}">
+          <input id="sortByField" type="hidden" name="tx_kesearch_pi1[sortByField]" value="{sortByField}" />
+        </f:if>
+        <f:if condition="{sortByDir}">
+          <input id="sortByDir" type="hidden" name="tx_kesearch_pi1[sortByDir]" value="{sortByDir}" />
+        </f:if>
+
+        <f:if condition="{filters}">
+          <div id="kesearch_filters">
+            <f:render partial="Filters"
+              arguments="{conf: conf, numberofresults: numberofresults, resultrows: resultrows, filters: filters}" />
+          </div>
+        </f:if>
+
+    </fieldset>
+  </form>
+</f:section>
+
+</html>
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.eot
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.eot
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.eot?
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.eot?
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.svg
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.svg
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.ttf
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.ttf
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.woff
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.woff
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.woff2
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.woff2
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.woff2.1
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Lt.woff2.1
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.eot
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.eot
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.eot?
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.eot?
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.eot?.1
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.eot?.1
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.svg
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.svg
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.ttf
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.ttf
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.woff
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.woff
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.woff2
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-LtIt.woff2
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.eot
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.eot
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.svg
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.svg
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.ttf
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.ttf
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.woff
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.woff
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.woff2
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.woff2
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.woff2.1
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-Md.woff2.1
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBd.eot
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBd.eot
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBd.svg
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBd.svg
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBd.ttf
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBd.ttf
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBd.woff
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBd.woff
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBd.woff2
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBd.woff2
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBdIt.eot
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBdIt.eot
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBdIt.svg
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBdIt.svg
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBdIt.ttf
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBdIt.ttf
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBdIt.woff
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBdIt.woff
--- a/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBdIt.woff2
+++ b/packages/base-design/Resources/Public/Fonts/Geogrotesque-SmBdIt.woff2
--- a/packages/base-design/Resources/Public/Images/favicon.png
+++ b/packages/base-design/Resources/Public/Images/favicon.png
--- a/packages/base-design/Resources/Public/Images/logo.png
+++ b/packages/base-design/Resources/Public/Images/logo.png
--- a/packages/base-design/Resources/Public/JavaScript/Dist/bootstrap-datepicker.min.js
+++ b/packages/base-design/Resources/Public/JavaScript/Dist/bootstrap-datepicker.min.js
--- a/packages/base-design/Resources/Public/JavaScript/Dist/jquery-3.7.1.min.js
+++ b/packages/base-design/Resources/Public/JavaScript/Dist/jquery-3.7.1.min.js
--- a/packages/base-design/Resources/Public/JavaScript/Dist/jquery.powertip.min.js
+++ b/packages/base-design/Resources/Public/JavaScript/Dist/jquery.powertip.min.js
--- a/packages/base-design/Resources/Public/JavaScript/matomo.js
+++ b/packages/base-design/Resources/Public/JavaScript/matomo.js
@@ -0,0 +1,11 @@
+var _paq = window._paq = window._paq || [];
+/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+_paq.push(['trackPageView']);
+_paq.push(['enableLinkTracking']);
+(function() {
+  var u="https://matomo.cloonar.com/";
+  _paq.push(['setTrackerUrl', u+'matomo.php']);
+  _paq.push(['setSiteId', '6']);
+  var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+  g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+})();
--- a/packages/base-design/Resources/Public/JavaScript/meta-nav.js
+++ b/packages/base-design/Resources/Public/JavaScript/meta-nav.js
@@ -0,0 +1,7 @@
+(function($) {
+  console.log("test");
+  $('#meta_menu').click(function (e) {
+    console.log("test");
+    $('#meta_menu').toggleClass('opened');
+  });
+}(jQuery || $));
--- a/packages/base-design/Resources/Public/JavaScript/newsAjaxPagination.js
+++ b/packages/base-design/Resources/Public/JavaScript/newsAjaxPagination.js
@@ -0,0 +1,31 @@
+document.querySelectorAll('.f3-widget-paginator a').forEach(function (el) {
+  el.addEventListener('click', newsAjaxHandler);
+});
+
+function newsAjaxHandler(e) {
+  var ajaxUrl = e.target.getAttribute('href');
+  if (ajaxUrl !== undefined && ajaxUrl !== '') {
+    e.preventDefault();
+    history.pushState(null, '', ajaxUrl.split('?')[0]);
+    var container = e.target.closest('.frame').getAttribute('id');
+    document.getElementById(container).classList.add('loading');
+    var xhr = new XMLHttpRequest();
+    xhr.open('GET', ajaxUrl, true);
+    xhr.onreadystatechange = function() {
+      if (xhr.readyState === 4 && xhr.status === 200) {
+        var parser = new DOMParser();
+        var result = parser.parseFromString(xhr.responseText, 'text/html');
+        var ajaxDom = result.getElementById(container);
+        ajaxDom.querySelectorAll('.f3-widget-paginator a').forEach(function (el) {
+          el.addEventListener('click', newsAjaxHandler);
+        });
+        document.getElementById(container).replaceWith(ajaxDom);
+        window.scrollTo({
+          top: document.getElementById(container).offsetTop - 111,
+          behavior: 'smooth'
+        });
+      }
+    };
+    xhr.send();
+  }
+}
--- a/packages/base-design/Resources/Public/JavaScript/search.js
+++ b/packages/base-design/Resources/Public/JavaScript/search.js
@@ -0,0 +1,15 @@
+const searchButton = document.querySelector(".search-wrap button");
+searchButton.addEventListener("click", function (e) {
+  if(window.innerWidth < 992) return;
+  e.preventDefault();
+  if (!searchButton.parentElement.parentElement.parentElement.classList.contains('opened')) {
+    searchButton.parentElement.parentElement.parentElement.classList.add('opened');
+    searchButton.parentElement.previousElementSibling.focus();
+  } else {
+    if (searchButton.parentElement.previousElementSibling.value != '') {
+      searchButton.closest('form').submit();
+    } else {
+      searchButton.parentElement.parentElement.parentElement.classList.remove('opened');
+    }
+  }
+});
--- a/packages/base-design/Resources/Public/Scss/Elements/elements.scss
+++ b/packages/base-design/Resources/Public/Scss/Elements/elements.scss
--- a/packages/base-design/Resources/Public/Scss/Layout/_fonts.scss
+++ b/packages/base-design/Resources/Public/Scss/Layout/_fonts.scss
@@ -0,0 +1,3 @@
+body {
+  font-family: 'sans-serif'
+}
--- a/packages/base-design/Resources/Public/Scss/Layout/_footer.scss
+++ b/packages/base-design/Resources/Public/Scss/Layout/_footer.scss
--- a/packages/base-design/Resources/Public/Scss/Layout/_form.scss
+++ b/packages/base-design/Resources/Public/Scss/Layout/_form.scss
--- a/packages/base-design/Resources/Public/Scss/Layout/_frame.scss
+++ b/packages/base-design/Resources/Public/Scss/Layout/_frame.scss
@@ -0,0 +1,21 @@
+:root {
+  --frame-outer-spacing-variant-zero: 0;
+  --frame-outer-spacing-variant-none: 2rem;
+  --frame-outer-spacing-variant-extra-large: 10rem;
+}
+
+.frame-space-after-none {
+  --frame-outer-spacing-after: var(--frame-outer-spacing-variant-none) !important;
+}
+
+.frame-space-before-none {
+  --frame-outer-spacing-before: var(--frame-outer-spacing-variant-none) !important;
+}
+
+.frame-space-after-zero {
+  --frame-outer-spacing-after: var(--frame-outer-spacing-variant-zero);
+}
+
+.frame-space-before-zero {
+  --frame-outer-spacing-before: var(--frame-outer-spacing-variant-zero);
+}
--- a/packages/base-design/Resources/Public/Scss/Layout/_search.scss
+++ b/packages/base-design/Resources/Public/Scss/Layout/_search.scss
--- a/packages/base-design/Resources/Public/Scss/Layout/_text.scss
+++ b/packages/base-design/Resources/Public/Scss/Layout/_text.scss
@@ -0,0 +1,35 @@
+h1, h2, h3, h4, h5, h6 {
+  font-weight: 500;
+  color: $primary;
+}
+
+.frame-background-primary {
+  color: $white;
+
+  .btn-primary {
+    background: $white;
+    color: $primary;
+  }
+
+  h1, h2, h3, h4, h5, h6 {
+    color: $white;
+  }
+}
+
+.frame-background-light {
+
+}
+
+a {
+  text-decoration: none;
+}
+
+.btn {
+  border-radius: 0;
+  border: none;
+  box-shadow: none;
+}
+
+.btn-primary {
+  color: $white;
+}
--- a/packages/base-design/Resources/Public/Scss/Layout/layout.scss
+++ b/packages/base-design/Resources/Public/Scss/Layout/layout.scss
@@ -0,0 +1,6 @@
+@import "fonts";
+@import "footer";
+@import "form";
+@import "frame";
+@import "search";
+@import "text";
--- a/packages/base-design/Resources/Public/Scss/main.scss
+++ b/packages/base-design/Resources/Public/Scss/main.scss
@@ -0,0 +1,22 @@
+@import "../../../../../vendor/bk2k/bootstrap-package/Resources/Public/Scss/bootstrap5/theme.scss";
+
+@import "Layout/layout";
+@import "Elements/elements";
+
+.frame {
+  &.loading {
+    position: relative;
+
+    &:before {
+        content: ' ';
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        z-index: 1;
+        background: rgba(255, 255, 255, .5);
+    }
+  }
+}
+
--- a/packages/base-design/composer.json
+++ b/packages/base-design/composer.json
@@ -0,0 +1,32 @@
+{
+  "name": "cloonar-typo3/base-design",
+  "authors": [
+    {
+      "name": "Dominik Polakovics",
+      "role": "Developer",
+      "homepage": "https://www.cloonar.com"
+    }
+  ],
+  "type": "typo3-cms-extension",
+  "description": "Template for Typo3 extending bootstrap package",
+  "homepage": "https://www.cloonar.com",
+  "require": {
+    "bk2k/bootstrap-package": "^15.0"
+  },
+  "autoload": {
+    "psr-4": {
+      "Cloonar\\BaseDesign\\": "Classes"
+    }
+  },
+  "extra": {
+    "typo3/cms": {
+      "extension-key": "base_design"
+    }
+  },
+  "config": {
+    "allow-plugins": {
+      "typo3/cms-composer-installers": true,
+      "typo3/class-alias-loader": true
+    }
+  }
+}
--- a/packages/base-design/ext_emconf.php
+++ b/packages/base-design/ext_emconf.php
@@ -0,0 +1,20 @@
+<?php
+
+$EM_CONF[$_EXTKEY] = array(
+  'title' => 'Base Design Package',
+  'description' => 'Base Design Customization.',
+  'category' => 'templates',
+  'autoload' => [
+    'psr-4' => [
+      'Cloonar\\BaseDesign\\' => 'Classes'
+    ],
+  ],
+  'state' => 'stable',
+  'uploadfolder' => true,
+  'createDirs' => '',
+  'clearCacheOnLoad' => 1,
+  'author' => 'Dominik Polakovics',
+  'author_email' => 'dominik.polakovics@cloonar.com',
+  'author_company' => 'private',
+  'version' => '1.0.0',
+);
--- a/packages/base-design/ext_localconf.php
+++ b/packages/base-design/ext_localconf.php
@@ -0,0 +1,39 @@
+<?php
+if (!defined('TYPO3')) {
+  die('Access denied.');
+}
+
+use TYPO3\CMS\Core\Utility\ExtensionManagementUtility;
+
+ExtensionManagementUtility::addTypoScriptSetup(
+  'module.tx_form {
+      settings {
+          yamlConfigurations {
+            1681331285 = EXT:base_design/Configuration/Yaml/Finishers/GetResponse.yaml
+          }
+      }
+  }'
+);
+
+ExtensionManagementUtility::addPageTSConfig(
+    "@import 'EXT:base_design/Configuration/TSconfig/News.tsconfig'"
+);
+
+if (\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::isLoaded('form')) {
+  \TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addTypoScriptSetup(trim('
+        module.tx_form {
+            settings {
+                yamlConfigurations {
+                    1727355960 = EXT:base_design/Configuration/Form/Setup.yaml
+                }
+            }
+        }
+        plugin.tx_form {
+            settings {
+                yamlConfigurations {
+                    1727355960 = EXT:base_design/Configuration/Form/Setup.yaml
+                }
+            }
+        }
+    '));
+}