diff --git a/public/locales/de/translation.json b/public/locales/de/translation.json index c87b4eb4cb15a0e531989cf962c689eb3700114e..a73d4825245069f66230115f63b706e6a65c62d6 100644 --- a/public/locales/de/translation.json +++ b/public/locales/de/translation.json @@ -25,6 +25,6 @@ "settings": "Cookie Einstellungen", "contact": "Kontakt", "help": "Hilfe", - "rights": "© 2022 GXFS.eu. All rights reserved." + "rights": "All rights reserved." } } diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index 41f9ae636b9090cff0491675e3d059e41d576512..1b7b60ae9156e6627da834d3d504e3df0e8220c6 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -26,10 +26,10 @@ "footer": { "imprint": "Imprint", "privacy": "Privacy Policy", - "settings": "Cookie Settings", + "settings": "Change Cookie Settings", "contact": "Contact", "help": "Help", - "rights": "© 2022 GXFS.eu. All rights reserved." + "rights": "All rights reserved." }, "welcome": { "title": "Welcome to the TSI Federation", diff --git a/src/assets/Gefoerdert_Durch_768x784.png b/src/assets/Gefoerdert_Durch_768x784.png new file mode 100644 index 0000000000000000000000000000000000000000..7a59a03d4c7d6dd5d165cbf1f45b2df01a1f54af Binary files /dev/null and b/src/assets/Gefoerdert_Durch_768x784.png differ diff --git a/src/assets/eco_Logo_red-1-1024x819.png b/src/assets/eco_Logo_red-1-1024x819.png new file mode 100644 index 0000000000000000000000000000000000000000..3eb483be10e24af8a85513b54ba00846ad6ed1bc Binary files /dev/null and b/src/assets/eco_Logo_red-1-1024x819.png differ diff --git a/src/components/footer/Footer.module.scss b/src/components/footer/Footer.module.scss index f1971c4d5b7632514ae805187c06c199c4d80876..a56cc3e6036014b9c3f86da901353a23c823b414 100644 --- a/src/components/footer/Footer.module.scss +++ b/src/components/footer/Footer.module.scss @@ -22,10 +22,22 @@ padding-top: 0; } padding-top: 1rem; - // align-self: flex-end; } } .link-row { padding: 1rem 0 !important; } +.non-underlined-link { + text-decoration: none; +} +.copyright-section { + border-top: 5px solid rgba(255, 255, 255, 0.1); +} +.center-text { + text-align: center; +} + +.footer-inner-container { + max-width: none !important; +} diff --git a/src/components/footer/Footer.tsx b/src/components/footer/Footer.tsx index f0c051a00dd00db1cfd8c29abde27ebaa5e68bd8..07a1ee52da447a2282678064b11ecd4968bbef3f 100644 --- a/src/components/footer/Footer.tsx +++ b/src/components/footer/Footer.tsx @@ -1,10 +1,12 @@ import React from 'react'; -import { Col, Container, Row } from 'react-bootstrap'; +import { Col, Container, Image, Row } from 'react-bootstrap'; import { useTranslation } from 'react-i18next'; import { Link } from 'react-router-dom'; import AppContext from '../../store/app-context'; import { NoPaddingFlexRowContainer } from '../ui/container'; import classes from './Footer.module.scss'; +import ecoLogo from '../../assets/eco_Logo_red-1-1024x819.png'; +import gefoerdertDurchLogo from '../../assets/Gefoerdert_Durch_768x784.png'; const Footer = () => { const { t } = useTranslation(); @@ -15,47 +17,100 @@ const Footer = () => { fluid className={classes['footer-container']} > - <Container> - <Row className={classes['link-row']}> + <Container className={classes['footer-inner-container']}> + <Row className='pb-3 pt-3'> <Col - md='auto' - as={Link} - to={routes.imprint} + sm={12} + md={4} > - {t('footer.imprint')} + <a + href='https://www.eco.de/' + target='_blank' + > + <Image + className='center' + src={ecoLogo} + alt='Eco Logo' + width={150} + height={120} + /> + </a> </Col> <Col - md='auto' - as={Link} - to={routes.privacy} + sm={12} + md={4} > - {t('footer.privacy')} + <p className={classes['center-text']}> + eco – Verband der Internetwirtschaft<br></br>Lichtstr. 43h<br></br>50825 Köln<br></br>Deutschland + <br></br> <br></br> + E-Mail: + <a + className={classes['non-underlined-link']} + href='mailto:info@gxfs.de' + > + info@gxfs.de + </a> + <br></br>Tel: +49 221 700048 0 + </p> + </Col> + <Col + sm={12} + md={4} + className='justify-content-md-center' + > + <a + href='https://www.bmwk.de/Navigation/DE/Home/home.html' + target='_blank' + > + <Image + className='center' + src={gefoerdertDurchLogo} + alt='Eco Logo' + width={150} + height={153} + /> + </a> </Col> + </Row> + <Row className='justify-content-md-center pb-3 pt-3'> <Col md='auto' as={Link} - to={routes.settings} + to={routes.imprint} > - {t('footer.settings')} + {t('footer.imprint')} </Col> <Col md='auto' as={Link} - to={routes.contact} + to={routes.privacy} > - {t('footer.contact')} + {t('footer.privacy')} </Col> <Col md='auto' as={Link} - to={routes.help} + to={routes.settings} > - {t('footer.help')} - </Col> - <Col lg='auto'> - <p className={classes.rights}>{t('footer.rights')}</p> + {t('footer.settings')} </Col> </Row> + <Row className={classes['copyright-section']}> + <div className='d-flex justify-content-center'> + <p className='pt-2 pb-2'> + © 2023{' '} + <a + className={classes['non-underlined-link']} + href='https://www.gxfs.eu' + title='GXFS.de' + > + GXFS.eu + </a> + {'. '} + {t('footer.rights')} + </p> + </div> + </Row> </Container> </NoPaddingFlexRowContainer> ); diff --git a/src/scss/App.scss b/src/scss/App.scss index c49778cf47f7f90332df5aa9af96e30483116184..620ccae8b12763ab2b9e5ab1001ace4a23897c1d 100644 --- a/src/scss/App.scss +++ b/src/scss/App.scss @@ -14,6 +14,7 @@ @import './_breakpoint-utils'; @import './overrides/_offcanvas'; @import './_spacing-utils'; +@import './_position-utils'; @import './_font-utils'; .App { diff --git a/src/scss/_position-utils.scss b/src/scss/_position-utils.scss new file mode 100644 index 0000000000000000000000000000000000000000..a9887654c6e6256d8827bfdbf216b74371ffd703 --- /dev/null +++ b/src/scss/_position-utils.scss @@ -0,0 +1,8 @@ +.float-right { + float: right; +} +.center { + display: block; + margin-left: auto; + margin-right: auto; +}