feat: add button to reconfigure cookie consent

src/assets/locales/de/translations.json

@@ -90,5 +90,7 @@
   "image.attribution": "Foto von ",
   "iframemanager.youtube.notice": "Dieser Inhalt wird von einer externen Quelle gehostet. Durch das Laden des Inhalts akzeptieren Sie die <a rel=\"noreferrer noopener\" href=\"https://www.youtube.com/t/terms\" target=\"_blank\">Nutzungsbedingungen</a> von youtube.com und stimmen einer möglichen Übertragung Ihrer Daten in Drittländer zu.",
   "iframemanager.youtube.load-button": "Inhalt laden",
-  "iframemanager.youtube.load-all-button": "Inhalt immer laden"
+  "iframemanager.youtube.load-all-button": "Inhalt immer laden",
+  "dataprivacy.reopen-cookie-consent": "Cookie-Einstellungen erneut öffnen",
+  "dataprivacy.cookie-consent-notice": "Wir respektieren Ihre Privatsphäre und möchten Ihnen volle Kontrolle über die Daten geben, die wir auf dieser Website verarbeiten. Über den untenstehenden Button können Sie unsere Cookie-Einstellungen öffnen und detailliert auswählen, welche Cookies Sie aktivieren oder deaktivieren möchten. Dort finden Sie auch eine genaue Auflistung aller von uns verwendeten Cookies sowie Informationen darüber, welche Daten gesammelt werden und zu welchem Zweck."
 }

src/assets/locales/en/translations.json

@@ -90,5 +90,7 @@
   "image.attribution": "Photo by ",
   "iframemanager.youtube.notice": "This content is hosted by a third party. By showing the external content you accept the <a rel=\"noreferrer noopener\" href=\"https://www.youtube.com/t/terms\" target=\"_blank\">terms and conditions</a> of youtube.com and agree to a possible transfer of your data to third countries.",
   "iframemanager.youtube.load-button": "Load video",
-  "iframemanager.youtube.load-all-button": "Load & don't ask again"
+  "iframemanager.youtube.load-all-button": "Load & don't ask again",
+  "dataprivacy.reopen-cookie-consent": "Reopen cookie consent preferences",
+  "dataprivacy.cookie-consent-notice": "We respect your privacy and want to give you full control over the data we process on this website. By clicking the button below, you can open our cookie settings and make detailed selections about which cookies you want to enable or disable. You’ll also find a comprehensive list of all the cookies we use, along with information about the data collected and its purposes."
 }

src/pages/data-privacy.tsx

@@ -5,18 +5,34 @@ import { Layout } from '../components/layout/layout';
 import { ContentBlockContainer } from '../components/layout/content-block-container';
 import { ContentfulRichText } from '../components/content/rich-text/rich-text';
 import { ContentfulPage, ContentfulRichTextType } from '../types';
+import { Button } from '../components/ui/buttons/button';
+import { useTranslation } from 'react-i18next';
+import Callout from '../components/ui/callout/callout';
+import styled from 'styled-components';
 
 interface DataPrivacyPageQueryProps {
   contentfulPage: ContentfulPage;
   locales: LocalesQueryProps;
 }
 
+const StyledText = styled.p`
+  margin: 0;
+  margin-bottom: 1rem;
+`;
+
 const DataPrivacyPage = ({
   data,
 }: PageProps<DataPrivacyPageQueryProps>): JSX.Element => {
+  const { t } = useTranslation();
   return (
     <Layout light={true}>
       <ContentBlockContainer>
+        <Callout illustration="selfOrganization_066">
+          <StyledText>{t('dataprivacy.cookie-consent-notice')}</StyledText>
+          <Button type="button" data-cc="show-preferencesModal">
+            {t('dataprivacy.reopen-cookie-consent')}
+          </Button>
+        </Callout>
         <ContentfulRichText
           data={data.contentfulPage.content as ContentfulRichTextType}
         />