feat(imprint): update imprint

CHANGELOG.md

@@ -34,6 +34,8 @@
 - Page headers
   - harmonization and standardization of page headers, added consistent headers and removed unused code
 - Use scroll to top button from shared components
+- Imprint
+  - updated imprint page with anonymized data
 
 ## 2.0.0
 

src/assets/locales/de/footer.json

@@ -11,9 +11,11 @@
     "treasurer": "Schatzmeister",
     "address": "Adresse",
     "contact&support": "Kontakt & Support",
-    "contact&supportDesc": "Antworten auf viele Fragen finden Sie auf unserer Support-Seite. Sollte Ihre Frage nicht beantwortet werden, nutzen Sie bitte unser Kontaktformular. Alternativ können Sie uns auch per E-Mail unter [email protected] kontaktieren.",
+    "contact&supportDesc": "Wenn Sie Hilfe benötigen, besuchen Sie bitte unsere Support-Seite oder nutzen Sie das Kontaktformular auf unserer Website. Für direkte Anfragen kontaktieren Sie uns über die bereitgestellten Kanäle auf der Kontaktseite.",
     "privacy": "Privatsphäre",
-    "privacyDesc": "Für Fragen zum Datenschutz und Informationen darüber, welche Daten bei Ihnen erhoben werden, finden Sie alle Details unter folgendem Link:"
+    "privacyDesc": "Für Fragen zum Datenschutz und Informationen darüber, welche Daten bei Ihnen erhoben werden, finden Sie alle Details unter folgendem Link:",
+    "privacyPolicy": "Datenschutzrichtlinie",
+    "catenaxAutomativeNetwork": "Catena-X Automotive Network e.V."
   },
   "privacy": {
     "title": "Privatsphäre",

src/assets/locales/en/footer.json

@@ -11,9 +11,11 @@
     "treasurer": "Treasurer",
     "address": "Address",
     "contact&support": "Contact & Support",
-    "contact&supportDesc": "You can find answers to many questions on our support page. If your question is not answered, please use our contact form. Alternatively, you can also contact us by email at [email protected].",
+    "contact&supportDesc": "For assistance, please refer to our support page or use the contact form provided on our website. For direct inquiries, contact us via the provided channels on the contact page.",
     "privacy": "Privacy",
-    "privacyDesc": "For questions about data protection and information about what data is collected from you, you can find all the details under the following link:"
+    "privacyDesc": "For questions about data protection and information about what data is collected from you, you can find all the details under the following link:",
+    "privacyPolicy": "Privacy Policy",
+    "catenaxAutomativeNetwork": "Catena-X Automotive Network e.V."
   },
   "privacy": {
     "title": "Privacy",

src/components/pages/Imprint/index.tsx

@@ -18,38 +18,75 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
-import { PageHeader, Typography } from '@catena-x/portal-shared-components'
+import {
+  Input,
+  PageHeader,
+  Typography,
+} from '@catena-x/portal-shared-components'
+import { Box } from '@mui/material'
 import { useTranslation } from 'react-i18next'
 
 export default function Imprint() {
   const { t } = useTranslation('footer', { keyPrefix: 'imprint' })
+
+  const handlePlaceHolder = (
+    label: string,
+    placeholder: string,
+    margin: string
+  ) => {
+    return (
+      <div>
+        <Box sx={{ display: 'inline-flex' }}>
+          <Typography variant="body2" sx={{ mt: 3 }}>
+            {label}
+          </Typography>
+          <div style={{ margin }}>
+            <Input
+              sx={{
+                width: 'max-width',
+                ml: 1,
+                p: 0,
+                display: 'inline-flex',
+                '.MuiFilledInput-input': { padding: '10px !important' },
+              }}
+              placeholder={placeholder}
+              disabled={true}
+            />
+          </div>
+        </Box>
+      </div>
+    )
+  }
+
   return (
     <main>
       <PageHeader headerHeight={200} topPage={true} title={t('title')} />
       <section>
         <Typography variant="h5">{t('directors')}</Typography>
-        <Typography variant="body2">Oliver Ganser ({t('ceo')})</Typography>
-        <Typography variant="body2">
-          Prof. Dr.-Ing. Boris Otto ({t('deputyCeo')})
-        </Typography>
-        <Typography variant="body2">
-          Claus Cremers ({t('treasurer')})
-        </Typography>
+        {handlePlaceHolder(`${t('ceo')} :`, 'Oliver Ganser', '-29px 0 0 0')}
+        {handlePlaceHolder(
+          `${t('deputyCeo')} :`,
+          'Prof. Dr.-Ing. Boris Otto',
+          '-25px 0 0 0'
+        )}
+        {handlePlaceHolder(
+          `${t('treasurer')} :`,
+          'Claus Cremers',
+          '-20px 0 0 0'
+        )}
         <br />
         <Typography variant="body2">{t('address')}</Typography>
-        <Typography variant="body2">
-          Catena-X Automotive Network e.V.
-        </Typography>
-        <Typography variant="body2">c/o IFOK GmbH</Typography>
-        <Typography variant="body2">Reinhardtstraße 58</Typography>
-        <Typography variant="body2">10117 Berlin</Typography>
+        <Typography variant="body2">{t('catenaxAutomativeNetwork')}</Typography>
+        {handlePlaceHolder('c/o : ', 'IFOK GmbH', '-20px 0 0 0')}
+        {handlePlaceHolder('', 'Reinhardtstraße 58', '-20px 0 0 0')}
+        {handlePlaceHolder('', '10117 Berlin', '-20px 0 0 0')}
         <br />
         <Typography variant="h5">{t('contact&support')}</Typography>
         <Typography variant="body2">{t('contact&supportDesc')}</Typography>
         <br />
         <Typography variant="h5">{t('privacy')}</Typography>
         <Typography variant="body2">{t('privacyDesc')}</Typography>
-        <a href=".">xxx.xxx.xxx</a>
+        <a href="./privacy">{t('privacyPolicy')}</a>
       </section>
     </main>
   )