diff --git a/docs/changelog.md b/docs/changelog.md
index a1bae2b2f06b593e85a743a5201606318eba9d18..0bb1e79e5ee710e3f9a9f568d46e77f3f37b0cbe 100644
--- a/docs/changelog.md
+++ b/docs/changelog.md
@@ -4,6 +4,12 @@ Das Format dieser Datei basiert auf [Keep a Changelog](https://keepachangelog.co
Das hier veröffentlichte Changelog bezieht sich auf die [Testinstanz von FIT-Connect](https://docs.fitko.de/fit-connect/docs/getting-started/get-started#testing).
+
+## 2022-10-14
+### Dokumentation
+- Auf der neuen Seite "Newsletter" können Sie unseren Newsletter abonnieren, der über wichtige Änderungen bei FIT-Connect informiert (Releases, neue Features und sicherheitsrelevante Themen).
+- Die FAQ finden Sie jetzt auf einer eigenen Seite, unter dem Menüpunkt "FAQ".
+
## 2022-10-13
### Dokumentation
- Dokumentation zur [Prüfung der `destinationSignature`](sending/get-destination.mdx#destinationSignature) überarbeitet und präzisiert.
diff --git a/docs/contact/contact.mdx b/docs/contact/contact.mdx
new file mode 100644
index 0000000000000000000000000000000000000000..bcf96a2bb4e4fea37d34de69c7a43136d1c7e39f
--- /dev/null
+++ b/docs/contact/contact.mdx
@@ -0,0 +1,41 @@
+---
+hide_table_of_contents: true
+hide_title: true
+---
+
+import Banner from '@components/Banner'
+import Card from '@components/Card'
+import MailToButton from '@components/MailToButton'
+import FAQList from '@views/FAQList'
+import '../../src/css/additional/custom.css';
+import Link from '@docusaurus/Link';
+
+<header className="max-w-3xl mx-auto text-center pb-16">
+ <h1 className="h1 mb-4">Kontakt</h1>
+ <p className="wtext-xl text-gray-600">Wenn Sie Unterstützung bei der Nutzung von FIT-Connect benötigen oder uns Feedback oder Anregungen mitgeben wollen, dann nutzen Sie bitte die entsprechenden Kontaktmöglichkeiten unten.</p>
+</header>
+
+<Banner>
+ <Card title={'Benötigen Sie Hilfe?'} icon={'Support'}>
+ <p className="text-gray-600 text-center">
+ Haben Sie Probleme oder benötigen Sie Unterstützung bei der Anbindung? Dann kontaktieren Sie unseren Support.
+ </p>
+ <MailToButton label={'Unterstützung anfragen'} recipient={'fit-connect-support@fjd.de'}/>
+ </Card>
+ <Card title={'Fehler gefunden oder Anregungen?'} icon={'Bug'}>
+ <p className="text-gray-600 text-center">
+ Wenn Sie Feedback oder Anregungen zu unseren Schnittstellen oder zu unserer Dokumentation haben, dann sind Sie hier genau richtig.
+ </p>
+ <a className={'btn border border-yellow-400 text-gray-800 hover:text-yellow-600 hover:border-yellow-600 cursor-pointer'}
+ target={'_blank'} href={'https://gitlab.opencode.de/fitko/feedback'}>
+ Fehler melden
+ </a>
+ </Card>
+ <Card title={'Sie wollen FIT-Connect nutzen?'} icon={'Send'}>
+ <p className="text-gray-600 text-center">
+ Sie wollen die FIT-Connect Infrastruktur für produktive Einsatzszenarien zur Übermittlung echter Verfahrensdaten nutzen?
+ </p>
+ <MailToButton label={'FITKO kontaktieren'} recipient={'fit-connect@fitko.de'}/>
+ </Card>
+</Banner>
+
diff --git a/docs/contact/newsletter.mdx b/docs/contact/newsletter.mdx
new file mode 100644
index 0000000000000000000000000000000000000000..7e25aa40a017ce1b40cc74045d038c7cf4f9caf8
--- /dev/null
+++ b/docs/contact/newsletter.mdx
@@ -0,0 +1,37 @@
+---
+hide_table_of_contents: true
+hide_title: true
+---
+
+import Banner from '@components/Banner'
+import Card from '@components/Card'
+import MailToButton from '@components/MailToButton'
+import FAQList from '@views/FAQList'
+import SubscribeNewsletter from '@components/SubscribeNewsletter'
+import '../../src/css/additional/custom.css';
+import Link from '@docusaurus/Link';
+
+
+<div className="center">
+
+<h2 className="h2 mb-4">Newsletter</h2>
+
+<h4 className="h4 mb-4">Abonnement</h4>
+
+<p className="fitko-newsletter" >Abonnieren Sie unseren Newsletter und bleiben Sie auf dem neusten Stand. <br/>
+ Unser Newsletter informiert Sie ausschließlich über neue Releases von FIT-Connect, neue Features und sicherheitsrelevante Themen. <br/>
+ Tragen Sie Ihre E-Mail-Adresse und Ihren Namen in die folgenden Felder eintragen - und Sie erhalten unseren Newsletter.
+</p>
+
+</div>
+
+<div className="center">
+
+ <SubscribeNewsletter formPostUrl="https://lists.fitko.net/mailman/subscribe/fit-connect-announce"></SubscribeNewsletter>
+
+</div>
+<br/>
+<p className="center">
+ Bisherige Ankündigungen finden Sie im Archiv des Newsletters, unter dem folgenden Link: <br/>
+ <Link to={'https://lists.fitko.net/pipermail/fit-connect-announce/'} >Archiv des Newsletters</Link>
+</p>
diff --git a/docs/getting-started/get-started.mdx b/docs/getting-started/get-started.mdx
index fb029249ef448f95815b2074171aaa0c02e202d9..45cd5358d493d2e4bcefd00ff2a1fe7a9dedfae6 100644
--- a/docs/getting-started/get-started.mdx
+++ b/docs/getting-started/get-started.mdx
@@ -38,3 +38,10 @@ Für Anbindungstests in der Testumgebung können Sie die folgenden Endpunkte & I
- [OAuth Token URL](./authentication.mdx): `https://auth-testing.fit-connect.fitko.dev/token`
- [Submission API](../apis/submission-api.mdx): `https://submission-api-testing.fit-connect.fitko.dev`
- [Routing API](../apis/routing-api.mdx): `https://routing-api-testing.fit-connect.fitko.dev`
+
+<br/>
+
+:::note Newsletter
+Bleiben Sie auf dem neusten Stand. <br/>
+Unser [Newsletter](../contact/newsletter.mdx) informiert Sie über neue Releases von FIT-Connect, neue Features und sicherheitsrelevante Themen, siehe [Newsletter Abonnement](../contact/newsletter.mdx).
+:::
diff --git a/docusaurus.config.js b/docusaurus.config.js
index bcfd32f4a3de7e1a876915ee7ad79fa6d128b293..3b936a868345d18d039f996d6127e7da0c637dff 100644
--- a/docusaurus.config.js
+++ b/docusaurus.config.js
@@ -92,6 +92,23 @@ module.exports = {
}
]
},
+ {to: '/faq', label: 'FAQ'},
+ {
+ type: 'dropdown',
+ label: 'Kontakt',
+ items: [
+ {
+ type: 'doc',
+ label: 'Support / Anregungen',
+ docId: 'contact/contact'
+ },
+ {
+ type: 'doc',
+ label: 'Newsletter',
+ docId: 'contact/newsletter'
+ }
+ ]
+ },
/*
{
type: 'dropdown',
@@ -106,7 +123,6 @@ module.exports = {
},
*/
{to: '/termine', label: 'Termine'},
- {to: '/contact', label: 'Kontakt'},
{
type: 'dropdown',
position: 'right',
diff --git a/src/components/SubscribeNewsletter.js b/src/components/SubscribeNewsletter.js
new file mode 100644
index 0000000000000000000000000000000000000000..aee46681019a3cbc17688a6538d0586278588e50
--- /dev/null
+++ b/src/components/SubscribeNewsletter.js
@@ -0,0 +1,26 @@
+import React, { useState } from 'react'
+import '../css/additional/custom.css';
+
+export default function SubscribeNewsletter({formPostUrl}) {
+
+ const [formSubmitted, setFormSubmitted] = useState(false);
+
+
+
+ const handleSubmit = (e) => {
+ setFormSubmitted(true);
+ }
+
+ return (
+ <form method="POST" action={formPostUrl} className="subscribe-form" onSubmit={handleSubmit}>
+ <label htmlFor="fullname">Name</label>
+ <input type="text" name="fullname" placeholder="(optional)" maxLength="64"></input><br />
+
+ <label htmlFor="email">E-Mail</label>
+ <input type="text" required name="email" placeholder="beispiel@example.com" maxLength="64"></input><br />
+
+ <input type="submit" disabled={formSubmitted} className="get-subscribe" name="email-button" value="Abonnieren"></input>
+
+ </form>
+ )
+}
diff --git a/src/css/additional/custom.css b/src/css/additional/custom.css
new file mode 100644
index 0000000000000000000000000000000000000000..858288b8edb62386550e4109d4faf68f85b43a85
--- /dev/null
+++ b/src/css/additional/custom.css
@@ -0,0 +1,117 @@
+dl dt {
+ font-weight: bold;
+ }
+
+ .alert,
+ .alert a,
+ .admonition,
+ .admonition-icon svg {
+ color: var(--ifm-font-color-base);
+ fill: var(--ifm-font-color-base);
+ stroke: var(--ifm-font-color-base);
+ }
+
+ .center {
+ text-align: center;
+ }
+
+ img {
+ color: red; /* color of alt text for images with invalid src url */
+ }
+
+ /* custom navbar back-to-root link */
+ .navbar__items {
+ position: relative;
+ }
+
+ @media screen and (min-width: 1000px) {
+ .has-back-btn .navbar__brand {
+ margin-left: 32px;
+ }
+ }
+
+ .has-back-btn .navbar__toggle.clean-btn {
+ margin-left: 32px;
+ }
+
+ .fitko-navbar-icon--back {
+ display: inline-block !important;
+ padding: 0;
+ position: absolute;
+ left: 2px;
+ top: 13px;
+ }
+
+ .fitko-navbar-icon--back a {
+ display: inline-block;
+ width: 24px;
+ height: 24px;
+ text-align: center;
+ }
+
+ .fitko-navbar-icon--back img {
+ display: inline-block;
+ height: 18px;
+ }
+
+ .fitko-navbar-icon--back.hidden {
+ display: none !important;
+ }
+
+ /* subscribe form START */
+ .subscribe-form label {
+ font-size: smaller;
+ display: block;
+ font-weight: 700;
+ }
+
+ .subscribe-form input {
+ margin-bottom: 0.5rem;
+ padding: 0.5rem 0.75rem;
+ border: 1px solid rgb(229 231 235);
+ border-radius: 0.5rem;
+ width: 100vw;
+ max-width: 320px;
+ }
+
+ .subscribe-form .get-subscribe {
+ margin: 1rem 0;
+ width: 190px;
+ color: #ffffff;
+ font-weight: 700;
+ border-color: var(--ifm-color-primary);
+ background-color: var(--ifm-color-primary);
+ cursor: pointer;
+ }
+
+ .subscribe-form .no-subscribe {
+ display: inline-block;
+ text-decoration: none;
+ font-size: x-small;
+ padding-left: 2.5rem;
+ margin-bottom: 1rem;
+ width: 120px;
+ text-align: right;
+ }
+
+ .fitko-newsletter {
+ max-width: 625px;
+ text-align: center;
+ display: inline-block;
+ margin-right: 50px;
+
+ }
+
+
+ @media screen and (max-width: 1000px){
+
+ .fitko-newsletter {
+
+ margin-left: 30px;
+ text-align: left;
+ max-width: 440px !important;
+
+ }
+
+ }
+
\ No newline at end of file
diff --git a/src/pages/faq.mdx b/src/pages/faq.mdx
new file mode 100644
index 0000000000000000000000000000000000000000..1e70bd715ca490ade4a36fa1616623866bb54266
--- /dev/null
+++ b/src/pages/faq.mdx
@@ -0,0 +1,6 @@
+---
+hide_table_of_contents: false
+---
+import FAQList from '@views/FAQList'
+
+<FAQList />
\ No newline at end of file
diff --git a/src/views/FAQList.jsx b/src/views/FAQList.jsx
index 44c615a15439c100175e3e49283452bcf074a0c0..46a02b9801fa00b9d940ef1ac3f45f7560d4940d 100644
--- a/src/views/FAQList.jsx
+++ b/src/views/FAQList.jsx
@@ -6,6 +6,7 @@ import Link from '@docusaurus/Link'
import ApiLink from '@components/ApiLink'
import faqs from '../data/faq-parsed.json'
import TOCInline from '@theme/TOCInline'
+import '@site/src/css/additional/custom.css'
let init = false
@@ -38,17 +39,13 @@ export default function FAQList() {
})
return (
- <div className="">
- <div className="py-12 md:py-20 border-t border-gray-200">
- <div className="flex">
- <div className="toc-inline flex-start pl-0 pr-12">
- <TOCInline toc={toc} minHeadingLevel={1} maxHeadingLevel={2} />
- </div>
-
- <div className="faq mx-auto px-4 sm:px-6">
+ <div>
+ <div className="py-12 md:py-20 border-gray-200">
+ <div className="flex">
+ <div className="faq mx-auto px-4 sm:px-6 fitko-newsletter">
<div className="max-w-3xl mx-auto text-center pb-10">
<h2 className="h2" id="FAQs">
- FAQs
+ FAQ
</h2>
</div>
{groups.map((group, i) => (
@@ -88,6 +85,10 @@ export default function FAQList() {
</div>
))}
</div>
+ <div className="toc-inline flex-start pl-0 pr-12 fitko-newsletter-content" style={{position: 'fixed', width: '250px', top: '160px', right: '10px'}} >
+ <TOCInline toc={toc} minHeadingLevel={1} maxHeadingLevel={2} />
+ </div>
+
{/* Section header */}
</div>
</div>